API tools faq
paste
Advertisement
atorresbr

MY FAMILY YOU THINGS FIZ CSS

atorresbr
Jun 12th, 2024 (edited)
508
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 28.87 KB | Fixit | 0 0
raw download clone embed print report
  1. /* my family you tings FIX CSS*/
  2.  
  3. #Field-numberInput,
  4. #Field-expiryInput,
  5. #Field-cvcInput {
  6.  
  7.   height: 65px;
  8.   width: 100%;
  9.   position: relative;
  10.   display: initial;
  11.   font-size:18px;
  12.  
  13. }
  14.  
  15. .woocommerce-content-box.full-width {
  16.   padding: 8px;
  17. }
  18.  
  19.  
  20. /*==================================================
  21. =            Bootstrap 3 Media Queries             =
  22. ==================================================*/
  23.  
  24. /*==========  Mobile First Method  ==========*/
  25.  
  26. /* Custom, iPhone Retina */
  27. @media only screen and (min-width : 320px) {
  28.  
  29. }
  30.  
  31. /* Extra Small Devices, Phones */
  32. @media only screen and (min-width : 360px) {
  33.  
  34. }
  35. /* Extra Small Devices, Phones */
  36. @media only screen and (min-width : 375px) {
  37.  
  38. }
  39. /* Extra Small Devices, Phones */
  40. @media only screen and (min-width : 415px) {
  41.  
  42. }
  43. /* Extra Small Devices, Phones */
  44. @media only screen and (min-width : 480px) {
  45.  
  46. }
  47. /* Extra Small Devices, Phones */
  48. @media only screen and (min-width : 643px) {
  49.  
  50. }
  51.  
  52. /* Small Devices, Tablets */
  53. @media only screen and (min-width : 768px) {
  54.  
  55. }
  56.  
  57. /* Medium Devices, Desktops */
  58. @media only screen and (min-width : 992px) {
  59.  
  60. }
  61.  
  62. /* Medium Devices, Desktops */
  63. @media only screen and (min-width : 1024px) {
  64.  
  65. }
  66.  
  67. /* Large Devices, Wide Screens */
  68. @media only screen and (min-width : 1200px) {
  69.  
  70. }
  71. /* Large Devices, Wide Screens */
  72. @media only screen and (min-width : 1280px) {
  73.  
  74. }
  75. /* Large Devices, Wide Screens */
  76. @media only screen and (min-width : 1440px) {
  77.  
  78. }
  79.  
  80. /*=====================================================
  81. =            Bootstrap 2.3.2 Media Queries            =
  82. =====================================================*/
  83. /* Large Devices, Wide Screens */
  84. @media only screen and (min-width : 1440px) {
  85.  
  86. }
  87.  
  88. /* Large Devices, Wide Screens */
  89. @media only screen and (max-width : 1280px) {
  90.  
  91. }
  92.  
  93. /* Large Devices, Wide Screens */
  94. @media only screen and (max-width : 1200px) {
  95.  
  96. }
  97. /* Medium Devices, Desktops */
  98. @media only screen and (max-width : 1024px) {
  99.  
  100. }
  101.  
  102. /* Medium Devices, Desktops */
  103. @media only screen and (max-width : 992px) {
  104.  
  105. }
  106.  
  107. /* Small Devices, Tablets */
  108. @media only screen and (max-width : 768px) {
  109.  
  110. }
  111. /* Extra Small Devices, Phones */
  112. @media only screen and (max-width : 643px) {
  113.  
  114. }
  115.  
  116. /* Extra Small Devices, Phones */
  117. @media only screen and (max-width : 480px) {
  118.  
  119. }
  120.  
  121. /* Extra Small Devices, Phones */
  122. @media only screen and (min-width : 415px) {
  123.  
  124. html #main {
  125.   padding: 10px !important;
  126. }
  127.  
  128.  
  129. }
  130.  
  131. /* Extra Small Devices, Phones */
  132. @media only screen and (max-width : 375px) {
  133.  
  134. }
  135. /* Custom, iPhone Retina */
  136. @media only screen and (max-width : 360px) {
  137.  
  138. }
  139. /* Custom, iPhone Retina */
  140. @media only screen and (max-width : 320px) {
  141.  
  142. }
  143.  
  144.  
  145. /* ----------- iPhones ----------- */
  146.  
  147. /*
  148. Based on:
  149. 1. http://stephen.io/mediaqueries
  150. 2. https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
  151. */
  152.  
  153. /* ----------- iPhone 4 and 4S ----------- */
  154.  
  155. /* Portrait and Landscape */
  156. @media only screen
  157.   and (min-device-width: 320px)
  158.   and (max-device-width: 480px)
  159.   and (-webkit-min-device-pixel-ratio: 2) {
  160.  
  161. }
  162.  
  163. /* Portrait */
  164. @media only screen
  165.   and (min-device-width: 320px)
  166.   and (max-device-width: 480px)
  167.   and (-webkit-min-device-pixel-ratio: 2)
  168.   and (orientation: portrait) {
  169. }
  170.  
  171. /* Landscape */
  172. @media only screen
  173.   and (min-device-width: 320px)
  174.   and (max-device-width: 480px)
  175.   and (-webkit-min-device-pixel-ratio: 2)
  176.   and (orientation: landscape) {
  177.  
  178. }
  179.  
  180. /* ----------- iPhone 5, 5S, 5C and 5SE ----------- */
  181.  
  182. /* Portrait and Landscape */
  183. @media only screen
  184.   and (min-device-width: 320px)
  185.   and (max-device-width: 568px)
  186.   and (-webkit-min-device-pixel-ratio: 2) {
  187.  
  188. }
  189.  
  190. /* Portrait */
  191. @media only screen
  192.   and (min-device-width: 320px)
  193.   and (max-device-width: 568px)
  194.   and (-webkit-min-device-pixel-ratio: 2)
  195.   and (orientation: portrait) {
  196. }
  197.  
  198. /* Landscape */
  199. @media only screen
  200.   and (min-device-width: 320px)
  201.   and (max-device-width: 568px)
  202.   and (-webkit-min-device-pixel-ratio: 2)
  203.   and (orientation: landscape) {
  204.  
  205. }
  206.  
  207. /* ----------- iPhone 6, 6S, 7 and 8 ----------- */
  208.  
  209. /* Portrait and Landscape */
  210. @media only screen
  211.   and (min-device-width: 375px)
  212.   and (max-device-width: 667px)
  213.   and (-webkit-min-device-pixel-ratio: 2) {
  214.  
  215. }
  216.  
  217.  
  218. /*==================================================
  219. =         iPhone 6, 6S, 7 and 8 Portrait          =
  220. ==================================================*/
  221. @media only screen
  222.   and (min-device-width: 375px)
  223.   and (max-device-width: 667px)
  224.   and (-webkit-min-device-pixel-ratio: 2)
  225.   and (orientation: portrait) {
  226.  
  227. }
  228.  
  229. /*==================================================
  230. =         iPhone 6, 6S, 7 and 8 Landscape          =
  231. ==================================================*/
  232. @media only screen
  233.   and (min-device-width: 375px)
  234.   and (max-device-width: 667px)
  235.   and (-webkit-min-device-pixel-ratio: 2)
  236.   and (orientation: landscape) {
  237.  
  238. }
  239.  
  240.  
  241.  
  242.  /*                                                                                  
  243.  _ _____ _                  ___   _           ___   _                _    ___   _  
  244. |_|  _  | |_ ___ ___ ___   |  _|_| |_        |_  |_| |_    ___ ___ _| |  | . |_| |_
  245. | |   __|   | . |   | -_|  | . |_   _|   _     | |_   _|  | .'|   | . |  | . |_   _|
  246. |_|__|  |_|_|___|_|_|___|  |___| |_|    | |    |_| |_|    |__,|_|_|___|  |___| |_|  
  247.                                         |_|                                        
  248. iPhone 6+, 7+ and 8+  */
  249.  
  250. /*==================================================
  251. =   iPhone 6+, 7+ and 8+ Portrait and Landscape    =
  252. ==================================================*/
  253. @media only screen
  254.   and (min-device-width: 414px)
  255.   and (max-device-width: 736px)
  256.   and (-webkit-min-device-pixel-ratio: 3) {
  257.  
  258. }
  259.  
  260. /*==================================================
  261. =          iPhone 6+, 7+ and 8+ Portrait          =
  262. ==================================================*/
  263. @media only screen
  264.   and (min-device-width: 414px)
  265.   and (max-device-width: 736px)
  266.   and (-webkit-min-device-pixel-ratio: 3)
  267.   and (orientation: portrait) {
  268.  
  269. }
  270.  
  271. /*==================================================
  272. =         iPhone 6+, 7+ and 8+ Landscape          =
  273. ==================================================*/
  274. @media only screen
  275.   and (min-device-width: 414px)
  276.   and (max-device-width: 736px)
  277.   and (-webkit-min-device-pixel-ratio: 3)
  278.   and (orientation: landscape) {
  279.  
  280. }
  281.  
  282.  
  283.  /*                                
  284.  _ _____ _                  __ __
  285. |_|  _  | |_ ___ ___ ___   |  |  |
  286. | |   __|   | . |   | -_|  |-   -|
  287. |_|__|  |_|_|___|_|_|___|  |__|__|
  288.  
  289. iPhome X */
  290.                                  
  291.  
  292. /*==================================================
  293. =         iPhone X Portrait and Landscape          =
  294. ==================================================*/
  295. @media only screen
  296.   and (min-device-width: 375px)
  297.   and (max-device-width: 812px)
  298.   and (-webkit-min-device-pixel-ratio: 3) {
  299.  
  300. }
  301.  
  302. /*==================================================
  303. =                iPhone X Portrait                 =
  304. ==================================================*/
  305. @media only screen
  306.   and (min-device-width: 375px)
  307.   and (max-device-width: 812px)
  308.   and (-webkit-min-device-pixel-ratio: 3)
  309.   and (orientation: portrait) {
  310.  
  311. }
  312.  
  313. /*==================================================
  314. =                iPhone X Landscape                =
  315. ==================================================*/
  316. @media only screen
  317.   and (min-device-width: 375px)
  318.   and (max-device-width: 812px)
  319.   and (-webkit-min-device-pixel-ratio: 3)
  320.   and (orientation: landscape) {
  321.  
  322. }
  323.  
  324.  
  325.  
  326.  
  327. /*==================================================
  328. =            Old versions for iPhones             =
  329. ==================================================*/
  330.  
  331. /*
  332. iPhone 2G, 3G, 4, 4S Media Queries
  333. It's noteworthy that these media queries are also the same for iPod Touch generations 1-4.
  334. */
  335. /*==================================================
  336. =      iPhone 2G-4S in portrait & landscape        =
  337. ==================================================*/
  338. @media only screen
  339.     and (min-device-width : 320px)
  340.     and (max-device-width : 480px) {
  341.  
  342. }
  343. /*==================================================
  344. =            iPhone 2G-4S in landscape            =
  345. ==================================================*/
  346. @media only screen
  347.     and (min-device-width : 320px)
  348.     and (max-device-width : 480px)
  349.     and (orientation : landscape) {
  350.  
  351. }
  352. /*==================================================
  353. =            iPhone 2G-4S in portrait            =
  354. ==================================================*/
  355. @media only screen
  356.     and (min-device-width : 320px)
  357.     and (max-device-width : 480px)
  358.     and (orientation : portrait) {
  359.  
  360. }
  361.  
  362.  
  363. /*
  364.  _ _____ _____ ____  _____
  365. |_|  _  |  _  |    \|   __|
  366. | |   __|     |  |  |__   |
  367. |_|__|  |__|__|____/|_____|
  368.                            
  369. iPads */
  370.  
  371. /*==================================================
  372. =           iPad in portrait & landscape           =
  373. ==================================================*/
  374. @media only screen
  375.     and (min-device-width : 768px)
  376.     and (max-device-width : 1024px)  {
  377.  
  378. }
  379.  
  380. /*==================================================
  381. =                 iPad in landscape                =
  382. ==================================================*/
  383. @media only screen
  384.     and (min-device-width : 768px)
  385.     and (max-device-width : 1024px)
  386.     and (orientation : landscape) {
  387.  
  388. }
  389.  
  390. /*==================================================
  391. =                 iPad in portrait                =
  392. ==================================================*/
  393. @media only screen
  394.     and (min-device-width : 768px)
  395.     and (max-device-width : 1024px)
  396.     and (orientation : portrait) {
  397.  
  398. }
  399.  
  400. /*
  401.  
  402.  _ _____       _    ___           _ _____       _    ___        
  403. |_|  _  |___ _| |  |_  |         |_|  _  |___ _| |  |_  |      
  404. | |   __| .'| . |   _| |_    _   | |   __| .'| . |  |  _|      
  405. |_|__|  |__,|___|  |_____|  |_|  |_|__|  |__,|___|  |___|      
  406.                                                                
  407.  _ _____       _          _     _              _    _____ _    
  408. |_|  _  |___ _| |   _____|_|___|_|   ___ ___ _| |  |  _  |_|___
  409. | |   __| .'| . |  |     | |   | |  | .'|   | . |  |     | |  _|
  410. |_|__|  |__,|___|  |_|_|_|_|_|_|_|  |__,|_|_|___|  |__|__|_|_|  
  411.                                                                
  412. iPad 1, 2, Mini and Air */
  413.  
  414.  
  415. /* Portrait and Landscape */
  416. @media only screen
  417.   and (min-device-width: 768px)
  418.   and (max-device-width: 1024px)
  419.   and (-webkit-min-device-pixel-ratio: 1) {
  420.  
  421. }
  422.  
  423. /* Portrait */
  424. @media only screen
  425.   and (min-device-width: 768px)
  426.   and (max-device-width: 1024px)
  427.   and (orientation: portrait)
  428.   and (-webkit-min-device-pixel-ratio: 1) {
  429.  
  430. }
  431.  
  432. /* Landscape */
  433. @media only screen
  434.   and (min-device-width: 768px)
  435.   and (max-device-width: 1024px)
  436.   and (orientation: landscape)
  437.   and (-webkit-min-device-pixel-ratio: 1) {
  438.  
  439. }
  440.  
  441. /* ----------- iPad 3, 4 and Pro 9.7" ----------- */
  442.  
  443. /* Portrait and Landscape */
  444. @media only screen
  445.   and (min-device-width: 768px)
  446.   and (max-device-width: 1024px)
  447.   and (-webkit-min-device-pixel-ratio: 2) {
  448.  
  449. }
  450.  
  451. /* Portrait */
  452. @media only screen
  453.   and (min-device-width: 768px)
  454.   and (max-device-width: 1024px)
  455.   and (orientation: portrait)
  456.   and (-webkit-min-device-pixel-ratio: 2) {
  457.  
  458. }
  459.  
  460. /* Landscape */
  461. @media only screen
  462.   and (min-device-width: 768px)
  463.   and (max-device-width: 1024px)
  464.   and (orientation: landscape)
  465.   and (-webkit-min-device-pixel-ratio: 2) {
  466.  
  467. }
  468.  
  469. /*
  470.                                                          
  471.  _ _____       _    _____            ___   ___         ___
  472. |_|  _  |___ _| |  |  _  |___ ___   |_  | |   |       |  _|
  473. | |   __| .'| . |  |   __|  _| . |   _| |_| | |   _   |_  |
  474. |_|__|  |__,|___|  |__|  |_| |___|  |_____|___|  |_|  |___|
  475.                                                            
  476. iPad Pro 10.5 */
  477.  
  478. /* Portrait and Landscape */
  479. @media only screen
  480.   and (min-device-width: 834px)
  481.   and (max-device-width: 1112px)
  482.   and (-webkit-min-device-pixel-ratio: 2) {
  483.  
  484. }
  485.  
  486. /* Portrait */
  487. /* Declare the same value for min- and max-width to avoid colliding with desktops */
  488. /* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
  489. @media only screen
  490.   and (min-device-width: 834px)
  491.   and (max-device-width: 834px)
  492.   and (orientation: portrait)
  493.   and (-webkit-min-device-pixel-ratio: 2) {
  494.  
  495. }
  496.  
  497. /* Landscape */
  498. /* Declare the same value for min- and max-width to avoid colliding with desktops */
  499. /* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
  500. @media only screen
  501.   and (min-device-width: 1112px)
  502.   and (max-device-width: 1112px)
  503.   and (orientation: landscape)
  504.   and (-webkit-min-device-pixel-ratio: 2) {
  505.  
  506. }
  507.  
  508. /*                                                        
  509.  _ _____       _    _____            ___   ___         ___
  510. |_|  _  |___ _| |  |  _  |___ ___   |_  | |_  |       | . |
  511. | |   __| .'| . |  |   __|  _| . |   _| |_|  _|   _   |_  |
  512. |_|__|  |__,|___|  |__|  |_| |___|  |_____|___|  |_|  |___|
  513.  
  514. iPad Pro 12.9 */
  515.                                                            
  516.  
  517. /*==================================================
  518. =       iPad Pro 12.9 Portrait and Landscape       =
  519. ==================================================*/
  520. @media only screen
  521.   and (min-device-width: 1024px)
  522.   and (max-device-width: 1366px)
  523.   and (-webkit-min-device-pixel-ratio: 2) {
  524.  
  525. }
  526.  
  527. /*==================================================
  528. =             iPad Pro 12.9  Portrait             =
  529. ==================================================*/
  530. /* Declare the same value for min- and max-width to avoid colliding with desktops */
  531. /* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
  532.  
  533. @media only screen
  534.   and (min-device-width: 1024px)
  535.   and (max-device-width: 1024px)
  536.   and (orientation: portrait)
  537.   and (-webkit-min-device-pixel-ratio: 2) {
  538.  
  539. }
  540.  
  541. /*==================================================
  542. =              iPad Pro 12.9 Landscape              =
  543. ==================================================*/
  544. /* Declare the same value for min- and max-width to avoid colliding with desktops */
  545. /* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
  546.  
  547. @media only screen
  548.   and (min-device-width: 1366px)
  549.   and (max-device-width: 1366px)
  550.   and (orientation: landscape)
  551.   and (-webkit-min-device-pixel-ratio: 2) {
  552.  
  553. }
  554.  
  555.  
  556.  
  557. /*
  558.  _____ _____ __    _____ __ __ _    _____ _____ _____ _____ _____ _____
  559. |   __|  _  |  |  |  _  |  |  |_|  |  _  |  |  |     |   | |   __|   __|
  560. |  |  |     |  |__|     |-   -| |  |   __|     |  |  | | | |   __|__   |
  561. |_____|__|__|_____|__|__|__|__|_|  |__|  |__|__|_____|_|___|_____|_____|
  562.                                                                        
  563. Galaxi Phones */
  564.  
  565. /*==================================================
  566. =         Galaxy S3 portrait and landscape         =
  567. ==================================================*/
  568. @media screen
  569.     and (device-width: 320px)
  570.     and (device-height: 640px)
  571.     and (-webkit-device-pixel-ratio: 2) {
  572.  
  573. }
  574.  
  575. /*==================================================
  576. =               Galaxy S3 portrait                 =
  577. ==================================================*/
  578. @media screen
  579.     and (device-width: 320px)
  580.     and (device-height: 640px)
  581.     and (-webkit-device-pixel-ratio: 2)
  582.     and (orientation: portrait) {
  583.  
  584. }
  585.  
  586. /*==================================================
  587. =               Galaxy S3 landscape                =
  588. ==================================================*/
  589. @media screen
  590.     and (device-width: 320px)
  591.     and (device-height: 640px)
  592.     and (-webkit-device-pixel-ratio: 2)
  593.     and (orientation: landscape) {
  594.  
  595. }
  596.  
  597. /*==================================================
  598. =         Galaxy S4 portrait and landscape         =
  599. ==================================================*/
  600. @media screen
  601.     and (device-width: 320px)
  602.     and (device-height: 640px)
  603.     and (-webkit-device-pixel-ratio: 3) {
  604.  
  605. }
  606. /*==================================================
  607. =              Galaxy S4 portrait                 =
  608. ==================================================*/
  609. @media screen
  610.     and (device-width: 320px)
  611.     and (device-height: 640px)
  612.     and (-webkit-device-pixel-ratio: 3)
  613.     and (orientation: portrait) {
  614.  
  615. }
  616. /*==================================================
  617. =               Galaxy S4 landscape                =
  618. ==================================================*/
  619. @media screen
  620.     and (device-width: 320px)
  621.     and (device-height: 640px)
  622.     and (-webkit-device-pixel-ratio: 3)
  623.     and (orientation: landscape) {
  624.  
  625. }
  626.  
  627. /*==================================================
  628. =       Galaxy S5 portrait and landscape          =
  629. ==================================================*/
  630. @media screen
  631.     and (device-width: 360px)
  632.     and (device-height: 640px)
  633.     and (-webkit-device-pixel-ratio: 3) {
  634.  
  635. }
  636.  
  637. /*==================================================
  638. =               Galaxy S5 portrait                =
  639. ==================================================*/
  640. @media screen
  641.     and (device-width: 360px)
  642.     and (device-height: 640px)
  643.     and (-webkit-device-pixel-ratio: 3)
  644.     and (orientation: portrait) {
  645.  
  646. }
  647.  
  648. /*==================================================
  649. =               Galaxy S5 landscape                =
  650. ==================================================*/
  651. @media screen
  652.     and (device-width: 360px)
  653.     and (device-height: 640px)
  654.     and (-webkit-device-pixel-ratio: 3)
  655.     and (orientation: landscape) {
  656.  
  657. }
  658.  
  659. /*                                              
  660.  _____ _____ _____    _____ _____ _____
  661. |  |  |_   _|     |  |     |   | |   __|
  662. |     | | | |   --|  |  |  | | | |   __|
  663. |__|__| |_| |_____|  |_____|_|___|_____|                                
  664.  
  665. HTC One */
  666.  
  667. /*==================================================
  668. =          HTC One portrait and landscape          =
  669. ==================================================*/
  670. @media screen
  671.     and (device-width: 360px)
  672.     and (device-height: 640px)
  673.     and (-webkit-device-pixel-ratio: 3) {
  674.  
  675. }
  676.  
  677. /*==================================================
  678. =                HTC One portrait                 =
  679. ==================================================*/
  680. @media screen
  681.     and (device-width: 360px)
  682.     and (device-height: 640px)
  683.     and (-webkit-device-pixel-ratio: 3)
  684.     and (orientation: portrait) {
  685.  
  686. }
  687.  
  688. /*==================================================
  689. =                HTC One landscape                 =
  690. ==================================================*/
  691. @media screen
  692.     and (device-width: 360px)
  693.     and (device-height: 640px)
  694.     and (-webkit-device-pixel-ratio: 3)
  695.     and (orientation: landscape) {
  696.  
  697. }
  698.  
  699. /*
  700. iPad 3 & 4 Media Queries
  701. If you're looking to target only 3rd and 4th generation Retina iPads
  702. (or tablets with similar resolution) to add @2x graphics,
  703. or other features for the tablet's Retina display, use the following media queries.
  704.  
  705. As regras de cima determinam que se você precisa de uma determinada regra de media querie
  706. para Tablets de 3° ou 4° Geração ou tablets com resoluções similares a estes dois exemploes
  707. para adicionar tipografia ou graficos com uma maior qualidade de resolução, use as regras abaixo.
  708. */
  709.  
  710. /*==================================================
  711. =       Retina iPad in portrait & landscape        =
  712. ==================================================*/
  713. @media only screen
  714.     and (min-device-width : 768px)
  715.     and (max-device-width : 1024px)
  716.     and (-webkit-min-device-pixel-ratio: 2) {
  717.  
  718. }
  719.  
  720. /*==================================================
  721. =            Retina iPad in landscape             =
  722. ==================================================*/
  723. @media only screen
  724.     and (min-device-width : 768px)
  725.     and (max-device-width : 1024px)
  726.     and (orientation : landscape)
  727.     and (-webkit-min-device-pixel-ratio: 2) {
  728.  
  729. }
  730.  
  731. /*==================================================
  732. =            Retina iPad in portrait               =
  733. ==================================================*/
  734. @media only screen
  735.     and (min-device-width : 768px)
  736.     and (max-device-width : 1024px)
  737.     and (orientation : portrait)
  738.     and (-webkit-min-device-pixel-ratio: 2) {
  739.  
  740. }
  741.  
  742. /*
  743. iPad 1 & 2 Media Queries
  744.  
  745. If you're looking to supply different graphics or choose different typography
  746. for the lower resolution iPad display, the media queries below will work
  747. like a charm in your 😘 responsive design ! ❤️‍🔥
  748.  
  749. Sobre a descrição acima: as regras definidas abaixo farão com que uma determinada
  750. tipografia ou imagens em alta resolução trabalhem bem com a baixa resolução dos
  751. iPads nas verões 1 e 2.
  752. */
  753.  
  754.  
  755. /*==================================================
  756. =       iPad 1 & 2 in portrait & landscape         =
  757. ==================================================*/
  758. @media only screen
  759.     and (min-device-width : 768px)
  760.     and (max-device-width : 1024px)
  761.     and (-webkit-min-device-pixel-ratio: 1) {
  762.  
  763. }
  764.  
  765. /*==================================================
  766. =             iPad 1 & 2 in landscape              =
  767. ==================================================*/
  768.  
  769. @media only screen
  770.     and (min-device-width : 768px)
  771.     and (max-device-width : 1024px)
  772.     and (orientation : landscape)
  773.     and (-webkit-min-device-pixel-ratio: 1) {
  774.  
  775. }
  776.  
  777. /*==================================================
  778. =             iPad 1 & 2 in portrait               =
  779. ==================================================*/
  780.  
  781. @media only screen
  782.     and (min-device-width : 768px)
  783.     and (max-device-width : 1024px)
  784.     and (orientation : portrait)
  785.     and (-webkit-min-device-pixel-ratio: 1) {
  786.  
  787. }
  788.  
  789. /*==================================================
  790. =        iPad mini in portrait & landscape         =
  791. ==================================================*/
  792.  
  793. @media only screen
  794.     and (min-device-width : 768px)
  795.     and (max-device-width : 1024px)
  796.     and (-webkit-min-device-pixel-ratio: 1) {
  797.  
  798. }
  799.  
  800. /*==================================================
  801. =              iPad mini in landscape              =
  802. ==================================================*/
  803.  
  804. @media only screen
  805.     and (min-device-width : 768px)
  806.     and (max-device-width : 1024px)
  807.     and (orientation : landscape)
  808.     and (-webkit-min-device-pixel-ratio: 1) {
  809.  
  810. }
  811.  
  812. /*==================================================
  813. =             iPad mini in portrait               =
  814. ==================================================*/
  815.  
  816. @media only screen
  817.     and (min-device-width : 768px)
  818.     and (max-device-width : 1024px)
  819.     and (orientation : portrait)
  820.     and (-webkit-min-device-pixel-ratio: 1) {
  821.  
  822.  
  823. }
  824.  
  825.  
  826. /*                                                        
  827.  _____ _____ __    _____ __ __ _    _____ _____ _____ _____
  828. |   __|  _  |  |  |  _  |  |  |_|  |_   _|  _  | __  |   __|
  829. |  |  |     |  |__|     |-   -| |    | | |     | __ -|__   |
  830. |_____|__|__|_____|__|__|__|__|_|    |_| |__|__|_____|_____|
  831.  
  832. Galaxi Tabs */
  833.  
  834. /*==================================================
  835. =     Galaxy Tab 10.1 portrait and landscape      =
  836. ==================================================*/
  837. @media
  838.     (min-device-width: 800px)
  839.     and (max-device-width: 1280px) {
  840.  
  841. }
  842.  
  843. /*==================================================
  844. =            Galaxy Tab 10.1 portrait             =
  845. ==================================================*/
  846. @media
  847.     (max-device-width: 800px)
  848.     and (orientation: portrait) {
  849.  
  850. }
  851.  
  852. /*==================================================
  853. =           Galaxy Tab 10.1 landscape             =
  854. ==================================================*/
  855. @media
  856.     (max-device-width: 1280px)
  857.     and (orientation: landscape) {
  858.  
  859. }
  860.  
  861. /*
  862.  _____ _____ _____ _____    _____ _____ _____ _____ _____ _____
  863. |  _  |   __|  |  |   __|  |  _  |  |  |     |   | |   __|   __|
  864. |     |__   |  |  |__   |  |   __|     |  |  | | | |   __|__   |
  865. |__|__|_____|_____|_____|  |__|  |__|__|_____|_|___|_____|_____|
  866.                                                                
  867. ASus Phones*/
  868.  
  869. /*==================================================
  870. =       Asus Nexus 7 portrait and landscape        =
  871. ==================================================*/
  872. @media screen
  873.     and (device-width: 601px)
  874.     and (device-height: 906px)
  875.     and (-webkit-min-device-pixel-ratio: 1.331)
  876.     and (-webkit-max-device-pixel-ratio: 1.332) {
  877.  
  878. }
  879.  
  880. /*==================================================
  881. =             Asus Nexus 7 portrait               =
  882. ==================================================*/
  883. @media screen
  884.     and (device-width: 601px)
  885.     and (device-height: 906px)
  886.     and (-webkit-min-device-pixel-ratio: 1.331)
  887.     and (-webkit-max-device-pixel-ratio: 1.332)
  888.     and (orientation: portrait) {
  889.  
  890. }
  891.  
  892. /*==================================================
  893. =             Asus Nexus 7 landscape               =
  894. ==================================================*/
  895. @media screen
  896.     and (device-width: 601px)
  897.     and (device-height: 906px)
  898.     and (-webkit-min-device-pixel-ratio: 1.331)
  899.     and (-webkit-max-device-pixel-ratio: 1.332)
  900.     and (orientation: landscape) {
  901.  
  902. }
  903.  
  904. /*                        
  905.  _____ _ _____ ____  __    _____
  906. |  |  |_|   | |    \|  |  |   __|
  907. |    -| | | | |  |  |  |__|   __|
  908. |__|__|_|_|___|____/|_____|_____|
  909.                                  
  910. Kindle */
  911.  
  912. /*==================================================
  913. =     Kindle Fire HD 7" portrait and landscape     =
  914. ==================================================*/
  915. @media only screen
  916.     and (min-device-width: 800px)
  917.     and (max-device-width: 1280px)
  918.     and (-webkit-min-device-pixel-ratio: 1.5) {
  919.  
  920. }
  921.  
  922. /*==================================================
  923. =           Kindle Fire HD 7" portrait             =
  924. ==================================================*/
  925. @media only screen
  926.     and (min-device-width: 800px)
  927.     and (max-device-width: 1280px)
  928.     and (-webkit-min-device-pixel-ratio: 1.5)
  929.     and (orientation: portrait) {
  930.  
  931. }
  932.  
  933. /*==================================================
  934. =          Kindle Fire HD 7" landscape            =
  935. ==================================================*/
  936. @media only screen
  937.     and (min-device-width: 800px)
  938.     and (max-device-width: 1280px)
  939.     and (-webkit-min-device-pixel-ratio: 1.5)
  940.     and (orientation: landscape) {
  941.  
  942. }
  943.  
  944. /*==================================================
  945. =   Kindle Fire HD 8.9" portrait and landscape     =
  946. ==================================================*/
  947. @media only screen
  948.     and (min-device-width: 1200px)
  949.     and (max-device-width: 1600px)
  950.     and (-webkit-min-device-pixel-ratio: 1.5) {
  951.  
  952. }
  953.  
  954. /*==================================================
  955. =         Kindle Fire HD 8.9" portrait            =
  956. ==================================================*/
  957. @media only screen
  958.     and (min-device-width: 1200px)
  959.     and (max-device-width: 1600px)
  960.     and (-webkit-min-device-pixel-ratio: 1.5)
  961.     and (orientation: portrait) {
  962.  
  963. }
  964.  
  965. /*==================================================
  966. =       Kindle Fire HD 8.9" landscape             =
  967. ==================================================*/
  968. @media only screen
  969.     and (min-device-width: 1200px)
  970.     and (max-device-width: 1600px)
  971.     and (-webkit-min-device-pixel-ratio: 1.5)
  972.     and (orientation: landscape) {
  973.  
  974. }
  975.  
  976.  
  977. /*                      
  978.  _____ _____ _____ _ _____ _____
  979. | __  |   __|_   _|_|   | |  _  |
  980. |    -|   __| | | | | | | |     |
  981. |__|__|_____| |_| |_|_|___|__|__|
  982.  
  983. Retina */
  984.                                  
  985.  
  986. /*==================================================
  987. =          Laptops non-retina screens             =
  988. ==================================================*/
  989. @media screen
  990.     and (min-device-width: 1200px)
  991.     and (max-device-width: 1600px)
  992.     and (-webkit-min-device-pixel-ratio: 1) {
  993.  
  994. }
  995.  
  996. /*==================================================
  997. =             Laptops retina screens              =
  998. ==================================================*/
  999. @media screen
  1000.     and (min-device-width: 1200px)
  1001.     and (max-device-width: 1600px)
  1002.     and (-webkit-min-device-pixel-ratio: 2)
  1003.     and (min-resolution: 192dpi) {
  1004.  
  1005. }
  1006.  
  1007.  
  1008. /*
  1009.  _ _ _ _____ _____ _____ _____ _____ _____
  1010. | | | |  _  |_   _|     |  |  |   __|   __|
  1011. | | | |     | | | |   --|     |   __|__   |
  1012. |_____|__|__| |_| |_____|__|__|_____|_____|
  1013.                                            
  1014. Apple Watch  */
  1015.  
  1016. /*==================================================
  1017. =                   Apple Watch                   =
  1018. ==================================================*/
  1019. @media
  1020.     (max-device-width: 42mm)
  1021.     and (min-device-width: 38mm) {
  1022.  
  1023. }
  1024.  
  1025. /*==================================================
  1026. =                   Moto 360 Watch                 =
  1027. ==================================================*/
  1028. @media
  1029.     (max-device-width: 218px)
  1030.     and (max-device-height: 281px) {
  1031.  
  1032. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!