API tools faq
paste
Advertisement
Guest User

2014 responsive CSS

a guest
Feb 16th, 2014
79
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 22.50 KB | None | 0 0
raw download clone embed print report
  1. /**
  2.  * 11.0 Media Queries
  3.  * -----------------------------------------------------------------------------
  4.  */
  5.  
  6. /* Does the same thing as <meta name="viewport" content="width=device-width">,
  7.  * but in the future W3C standard way. -ms- prefix is required for IE10+ to
  8.  * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
  9.  * the meta tag. See http://core.trac.wordpress.org/ticket/25888.
  10.  */
  11. @-ms-viewport {
  12.     width: device-width;
  13. }
  14.  
  15. @viewport {
  16.     width: device-width;
  17. }
  18.  
  19. @media screen and (max-width: 400px) {
  20.     .list-view .site-content .post-thumbnail {
  21.         background: none;
  22.         width: auto;
  23.         z-index: 2;
  24.     }
  25.  
  26.     .list-view .site-content .post-thumbnail img {
  27.         float: left;
  28.         margin: 0 10px 3px 0;
  29.         width: 84px;
  30.     }
  31.  
  32.     .list-view .site-content .entry-header {
  33.         background-color: transparent;
  34.         padding: 0;
  35.     }
  36.  
  37.     .list-view .content-area {
  38.         padding: 0 10px;
  39.     }
  40.  
  41.     .list-view .site-content .hentry {
  42.         border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  43.         margin: 0;
  44.         min-height: 60px;
  45.         padding: 12px 0 9px;
  46.     }
  47.  
  48.     .list-view .site-content .cat-links,
  49.     .list-view .site-content .entry-content,
  50.     .list-view .site-content .entry-summary,
  51.     .list-view .site-content footer.entry-meta {
  52.         display: none;
  53.     }
  54.  
  55.     .list-view .site-content .entry-title {
  56.         clear: none;
  57.         font-size: 15px;
  58.         font-weight: 900;
  59.         line-height: 1.2;
  60.         margin-bottom: 6px;
  61.         text-transform: none;
  62.     }
  63.  
  64.     .list-view .site-content .format-aside .entry-title,
  65.     .list-view .site-content .format-link .entry-title,
  66.     .list-view .site-content .format-quote .entry-title {
  67.         display: block;
  68.     }
  69.  
  70.     .list-view .site-content .entry-meta {
  71.         background-color: transparent;
  72.         clear: none;
  73.         margin: 0;
  74.         text-transform: none;
  75.     }
  76.  
  77.     .archive-header,
  78.     .page-header {
  79.         border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  80.         margin: 24px auto 0;
  81.         padding-bottom: 24px;
  82.     }
  83.  
  84.     .error404 .page-header {
  85.         border-bottom: 0;
  86.         margin: 0 auto 24px;
  87.         padding: 0 10px;
  88.     }
  89. }
  90.  
  91. @media screen and (min-width: 401px) {
  92.     a.post-thumbnail:hover img {
  93.         opacity: 0.85;
  94.     }
  95.  
  96.     .full-size-link:before,
  97.     .parent-post-link:before,
  98.     .site-content span + .byline:before,
  99.     .site-content span + .comments-link:before,
  100.     .site-content span + .edit-link:before,
  101.     .site-content span + .entry-date:before {
  102.         content: "";
  103.     }
  104.  
  105.     .attachment span.entry-date:before,
  106.     .entry-content .edit-link a:before,
  107.     .entry-meta .edit-link a:before,
  108.     .site-content .byline a:before,
  109.     .site-content .comments-link a:before,
  110.     .site-content .entry-date a:before,
  111.     .site-content .featured-post:before,
  112.     .site-content .full-size-link a:before,
  113.     .site-content .parent-post-link a:before,
  114.     .site-content .post-format a:before {
  115.         -webkit-font-smoothing: antialiased;
  116.         display: inline-block;
  117.         font: normal 16px/1 Genericons;
  118.         text-decoration: inherit;
  119.         vertical-align: text-bottom;
  120.     }
  121.  
  122.     .site-content .entry-meta > span {
  123.         margin-right: 10px;
  124.     }
  125.  
  126.     .site-content .format-video .post-format a:before {
  127.         content: "\f104";
  128.     }
  129.  
  130.     .site-content .format-audio .post-format a:before {
  131.         content: "\f109";
  132.     }
  133.  
  134.     .site-content .format-image .post-format a:before {
  135.         content: "\f473";
  136.     }
  137.  
  138.     .site-content .format-quote .post-format a:before {
  139.         content: "\f106";
  140.         margin-right: 2px;
  141.     }
  142.  
  143.     .site-content .format-gallery .post-format a:before {
  144.         content: "\f103";
  145.         margin-right: 4px;
  146.     }
  147.  
  148.     .site-content .format-aside .post-format a:before {
  149.         content: "\f101";
  150.         margin-right: 2px;
  151.     }
  152.  
  153.     .site-content .format-link .post-format a:before {
  154.         content: "\f107";
  155.         position: relative;
  156.         top: 1px;
  157.     }
  158.  
  159.     .site-content .featured-post:before {
  160.         content: "\f308";
  161.         margin-right: 3px;
  162.         position: relative;
  163.         top: 1px;
  164.     }
  165.  
  166.     .site-content .entry-date a:before,
  167.     .attachment .site-content span.entry-date:before {
  168.         content: "\f303";
  169.         margin-right: 1px;
  170.         position: relative;
  171.         top: 1px;
  172.     }
  173.  
  174.     .site-content .byline a:before {
  175.         content: "\f304";
  176.     }
  177.  
  178.     .site-content .comments-link a:before {
  179.         content: "\f300";
  180.         margin-right: 2px;
  181.     }
  182.  
  183.     .entry-content .edit-link a:before,
  184.     .entry-meta .edit-link a:before {
  185.         content: "\f411";
  186.     }
  187.  
  188.     .site-content .full-size-link a:before {
  189.         content: "\f402";
  190.         margin-right: 1px;
  191.     }
  192.  
  193.     .site-content .parent-post-link a:before {
  194.         content: "\f301";
  195.     }
  196.  
  197.     .list-view .site-content .hentry {
  198.         border-top: 1px solid rgba(0, 0, 0, 0.1);
  199.         padding-top: 48px;
  200.     }
  201.  
  202.     .list-view .site-content .hentry:first-of-type,
  203.     .list-view .site-content .hentry.has-post-thumbnail {
  204.         border-top: 0;
  205.         padding-top: 0;
  206.     }
  207.  
  208.     .archive-header,
  209.     .page-header {
  210.         margin: 0 auto 60px;
  211.         padding: 0 10px;
  212.     }
  213.  
  214.     .error404 .page-header {
  215.         margin-bottom: 24px;
  216.     }
  217. }
  218.  
  219. @media screen and (min-width: 594px) {
  220.     .site-content .entry-header {
  221.         padding-right: 30px;
  222.         padding-left: 30px;
  223.     }
  224.  
  225.     .site-content .has-post-thumbnail .entry-header {
  226.         margin-top: -48px;
  227.     }
  228. }
  229.  
  230. @media screen and (min-width: 673px) {
  231.     .header-main {
  232.         padding: 0 30px;
  233.     }
  234.  
  235.     .search-toggle {
  236.         margin-right: 18px;
  237.     }
  238.  
  239.     .search-box .search-field {
  240.         width: 50%;
  241.     }
  242.  
  243.     .content-area {
  244.         float: left;
  245.         width: 100%;
  246.     }
  247.  
  248.     .site-content {
  249.         margin-right: 33.33333333%;
  250.     }
  251.  
  252.     .site-content .has-post-thumbnail .entry-header {
  253.         margin-top: 0;
  254.     }
  255.  
  256.     .archive-header,
  257.     .comments-area,
  258.     .image-navigation,
  259.     .page-header,
  260.     .page-content,
  261.     .post-navigation,
  262.     .site-content .entry-content,
  263.     .site-content .entry-summary,
  264.     .site-content footer.entry-meta {
  265.         padding-right: 30px;
  266.         padding-left: 30px;
  267.     }
  268.  
  269.     .singular .site-content .hentry.has-post-thumbnail {
  270.         margin-top: 0;
  271.     }
  272.  
  273.     .full-width .site-content {
  274.         margin-right: 0;
  275.     }
  276.  
  277.     .full-width .site-content .has-post-thumbnail .entry-header,
  278.     .full-width.singular .site-content .hentry.has-post-thumbnail {
  279.         margin-top: -48px;
  280.     }
  281.  
  282.     #secondary,
  283.     #supplementary {
  284.         padding: 0 30px;
  285.     }
  286.  
  287.     .content-sidebar {
  288.         border: 0;
  289.         float: right;
  290.         margin-left: -33.33333333%;
  291.         padding: 48px 30px 24px;
  292.         width: 33.33333333%;
  293.     }
  294.  
  295.     .grid .featured-content .hentry {
  296.         float: left;
  297.         width: 50%;
  298.     }
  299.  
  300.     .grid .featured-content .hentry:nth-child( 2n+1 ) {
  301.         clear: both;
  302.     }
  303.  
  304.     .grid .featured-content .entry-header {
  305.         border-color: #000;
  306.         border-style: solid;
  307.         border-width: 12px 10px;
  308.         height: 96px;
  309.         padding: 0;
  310.     }
  311.  
  312.     .slider .featured-content .entry-title {
  313.         font-size: 22px;
  314.         line-height: 1.0909090909;
  315.     }
  316.  
  317.     .slider .featured-content .entry-header {
  318.         min-height: inherit;
  319.         padding: 24px 30px 48px;
  320.         position: absolute;
  321.         left: 0;
  322.         bottom: 0;
  323.         width: 50%;
  324.         z-index: 3;
  325.     }
  326.  
  327.     .slider-control-paging {
  328.         background: transparent;
  329.         margin-top: -48px;
  330.         padding-left: 20px;
  331.         width: 50%;
  332.     }
  333.  
  334.     .slider-direction-nav {
  335.         clear: none;
  336.         float: right;
  337.         margin-top: -48px;
  338.         width: 98px;
  339.     }
  340.  
  341.     .slider-direction-nav li {
  342.         border: 0;
  343.         padding: 0 1px 0 0;
  344.     }
  345.  
  346.     .slider-direction-nav li:last-child {
  347.         padding: 0 0 0 1px;
  348.     }
  349.  
  350.     .slider-direction-nav a {
  351.         height: 48px;
  352.     }
  353.  
  354.     .slider-direction-nav a:before {
  355.         line-height: 48px;
  356.     }
  357.  
  358.     .site-info {
  359.         padding: 15px 30px;
  360.     }
  361. }
  362.  
  363. @media screen and (min-width: 783px) {
  364.     .header-main {
  365.         padding-right: 0;
  366.     }
  367.  
  368.     .search-toggle {
  369.         margin-right: 0;
  370.     }
  371.  
  372.     /* Fixed Header */
  373.  
  374.     .masthead-fixed .site-header {
  375.         position: fixed;
  376.         top: 0;
  377.     }
  378.  
  379.     .admin-bar.masthead-fixed .site-header {
  380.         top: 32px;
  381.     }
  382.  
  383.     .masthead-fixed .site-main {
  384.         margin-top: 48px;
  385.     }
  386.  
  387.     /* Navigation */
  388.  
  389.     .site-navigation li .current_page_item > a,
  390.     .site-navigation li .current_page_ancestor > a,
  391.     .site-navigation li .current-menu-item > a,
  392.     .site-navigation li .current-menu-ancestor > a {
  393.         color: #fff;
  394.     }
  395.  
  396.     /* Primary Navigation */
  397.  
  398.     .primary-navigation {
  399.         float: right;
  400.         font-size: 11px;
  401.         margin: 0 1px 0 -12px;
  402.         padding: 0;
  403.         text-transform: uppercase;
  404.     }
  405.  
  406.     .primary-navigation .menu-toggle {
  407.         display: none;
  408.         padding: 0;
  409.     }
  410.  
  411.     .primary-navigation .nav-menu {
  412.         border-bottom: 0;
  413.         display: block;
  414.     }
  415.  
  416.     .primary-navigation.toggled-on {
  417.         border-bottom: 0;
  418.         margin: 0;
  419.         padding: 0;
  420.     }
  421.  
  422.     .primary-navigation li {
  423.         border: 0;
  424.         display: inline-block;
  425.         height: 48px;
  426.         line-height: 48px;
  427.         position: relative;
  428.     }
  429.  
  430.     .primary-navigation a {
  431.         display: inline-block;
  432.         padding: 0 12px;
  433.         white-space: nowrap;
  434.     }
  435.  
  436.     .primary-navigation ul ul {
  437.         background-color: #24890d;
  438.         float: left;
  439.         margin: 0;
  440.         position: absolute;
  441.         top: 48px;
  442.         left: -999em;
  443.         z-index: 99999;
  444.     }
  445.  
  446.     .primary-navigation li li {
  447.         border: 0;
  448.         display: block;
  449.         height: auto;
  450.         line-height: 1.0909090909;
  451.     }
  452.  
  453.     .primary-navigation ul ul ul {
  454.         left: -999em;
  455.         top: 0;
  456.     }
  457.  
  458.     .primary-navigation ul ul a {
  459.         padding: 18px 12px;
  460.         white-space: normal;
  461.         width: 176px;
  462.     }
  463.  
  464.     .primary-navigation li:hover > a,
  465.     .primary-navigation li.focus > a {
  466.         background-color: #24890d;
  467.         color: #fff;
  468.     }
  469.  
  470.     .primary-navigation ul ul a:hover,
  471.     .primary-navigation ul ul li.focus > a {
  472.         background-color: #41a62a;
  473.     }
  474.  
  475.     .primary-navigation ul li:hover > ul,
  476.     .primary-navigation ul li.focus > ul {
  477.         left: auto;
  478.     }
  479.  
  480.     .primary-navigation ul ul li:hover > ul,
  481.     .primary-navigation ul ul li.focus > ul {
  482.         left: 100%;
  483.     }
  484.  
  485.     .primary-navigation .menu-item-has-children > a,
  486.     .primary-navigation .page_item_has_children > a {
  487.         padding-right: 26px;
  488.     }
  489.  
  490.     .primary-navigation .menu-item-has-children > a:after,
  491.     .primary-navigation .page_item_has_children > a:after {
  492.         -webkit-font-smoothing: antialiased;
  493.         content: "\f502";
  494.         display: inline-block;
  495.         font: normal 8px/1 Genericons;
  496.         position: absolute;
  497.         right: 12px;
  498.         top: 22px;
  499.         vertical-align: text-bottom;
  500.     }
  501.  
  502.     .primary-navigation li .menu-item-has-children > a,
  503.     .primary-navigation li .page_item_has_children > a {
  504.         padding-right: 20px;
  505.         width: 168px;
  506.     }
  507.  
  508.     .primary-navigation .menu-item-has-children li.menu-item-has-children > a:after,
  509.     .primary-navigation .menu-item-has-children li.page_item_has_children > a:after,
  510.     .primary-navigation .page_item_has_children li.menu-item-has-children > a:after,
  511.     .primary-navigation .page_item_has_children li.page_item_has_children > a:after {
  512.         content: "\f501";
  513.         right: 8px;
  514.         top: 20px;
  515.     }
  516. }
  517.  
  518. @media screen and (min-width: 810px) {
  519.     .attachment .entry-attachment .attachment {
  520.         margin-right: -168px;
  521.         margin-left: -168px;
  522.         max-width: 810px;
  523.     }
  524.  
  525.     .attachment .site-content .attachment img {
  526.         display: block;
  527.         margin: 0 auto;
  528.     }
  529.  
  530.     .contributor-avatar {
  531.         margin-left: -168px;
  532.     }
  533.  
  534.     .contributor-summary {
  535.         float: left;
  536.     }
  537.  
  538.     .full-width .site-content blockquote.alignleft,
  539.     .full-width .site-content blockquote.alignright {
  540.         width: -webkit-calc(50% + 130px);
  541.         width:         calc(50% + 130px);
  542.     }
  543.  
  544.     .full-width .site-content blockquote.alignleft,
  545.     .full-width .site-content img.size-full.alignleft,
  546.     .full-width .site-content img.size-large.alignleft,
  547.     .full-width .site-content img.size-medium.alignleft,
  548.     .full-width .site-content .wp-caption.alignleft {
  549.         margin-left: -168px;
  550.     }
  551.  
  552.     .full-width .site-content .alignleft {
  553.         clear: left;
  554.     }
  555.  
  556.     .full-width .site-content blockquote.alignright,
  557.     .full-width .site-content img.size-full.alignright,
  558.     .full-width .site-content img.size-large.alignright,
  559.     .full-width .site-content img.size-medium.alignright,
  560.     .full-width .site-content .wp-caption.alignright {
  561.         margin-right: -168px;
  562.     }
  563.  
  564.     .full-width .site-content .alignright {
  565.         clear: right;
  566.     }
  567. }
  568.  
  569. @media screen and (min-width: 846px) {
  570.     .content-area,
  571.     .content-sidebar {
  572.         padding-top: 72px;
  573.     }
  574.  
  575.     .site-content .has-post-thumbnail .entry-header {
  576.         margin-top: -48px;
  577.     }
  578.  
  579.     .comment-list .trackback,
  580.     .comment-list .pingback,
  581.     .comment-list article {
  582.         margin-bottom: 36px;
  583.         padding-top: 36px;
  584.     }
  585.  
  586.     .comment-author .avatar {
  587.         height: 34px;
  588.         top: 2px;
  589.         width: 34px;
  590.     }
  591.  
  592.     .comment-author,
  593.     .comment-awaiting-moderation,
  594.     .comment-content,
  595.     .comment-list .reply,
  596.     .comment-metadata {
  597.         padding-left: 50px;
  598.     }
  599.  
  600.     .comment-list .children {
  601.         margin-left: 20px;
  602.     }
  603.  
  604.     .full-width.singular .site-content .hentry.has-post-thumbnail {
  605.         margin-top: -72px;
  606.     }
  607.  
  608.     .featured-content {
  609.         margin-bottom: 0;
  610.     }
  611. }
  612.  
  613. @media screen and (min-width: 1008px) {
  614.     .search-box-wrapper {
  615.         padding-left: 182px;
  616.     }
  617.  
  618.     .main-content {
  619.         float: left;
  620.     }
  621.  
  622.     .site-content {
  623.         margin-right: 29.04761904%;
  624.         margin-left: 182px;
  625.     }
  626.  
  627.     .site-content .entry-header {
  628.         margin-top: 0;
  629.     }
  630.  
  631.     .site-content .has-post-thumbnail .entry-header {
  632.         margin-top: 0;
  633.     }
  634.  
  635.     .content-sidebar {
  636.         margin-left: -29.04761904%;
  637.         width: 29.04761904%;
  638.     }
  639.  
  640.     .site:before {
  641.         background-color: #000;
  642.         content: "";
  643.         display: block;
  644.         height: 100%;
  645.         min-height: 100%;
  646.         position: absolute;
  647.         top: 0;
  648.         left: 0;
  649.         width: 182px;
  650.         z-index: 2;
  651.     }
  652.  
  653.     #secondary {
  654.         background-color: transparent;
  655.         border: 0;
  656.         clear: none;
  657.         float: left;
  658.         margin: 0 0 0 -100%;
  659.         min-height: 100vh;
  660.         width: 122px;
  661.     }
  662.  
  663.     .primary-sidebar {
  664.         padding-top: 0;
  665.     }
  666.  
  667.     .site-description {
  668.         display: block;
  669.         margin: -3px 0 21px;
  670.     }
  671.  
  672.     .site-description:empty {
  673.         margin: 0;
  674.     }
  675.  
  676.     .secondary-navigation {
  677.         font-size: 11px;
  678.         margin: 0 -30px 48px;
  679.         width: 182px;
  680.     }
  681.  
  682.     .secondary-navigation li {
  683.         border-top: 1px solid rgba(255, 255, 255, 0.2);
  684.         position: relative;
  685.     }
  686.  
  687.     .secondary-navigation a {
  688.         padding: 10px 30px;
  689.     }
  690.  
  691.     .secondary-navigation ul ul {
  692.         background-color: #24890d;
  693.         position: absolute;
  694.         top: 0;
  695.         left: -999em;
  696.         width: 182px;
  697.         z-index: 99999;
  698.     }
  699.  
  700.     .secondary-navigation li li {
  701.         border-top: 0;
  702.     }
  703.  
  704.     .secondary-navigation li:hover > a,
  705.     .secondary-navigation li.focus > a {
  706.         background-color: #24890d;
  707.         color: #fff;
  708.     }
  709.  
  710.     .secondary-navigation ul ul a:hover,
  711.     .secondary-navigation ul ul li.focus > a {
  712.         background-color: #41a62a;
  713.     }
  714.  
  715.     .secondary-navigation ul li:hover > ul,
  716.     .secondary-navigation ul li.focus > ul {
  717.         left: 162px;
  718.     }
  719.  
  720.     .secondary-navigation .menu-item-has-children > a {
  721.         padding-right: 38px;
  722.     }
  723.  
  724.     .secondary-navigation .menu-item-has-children > a:after {
  725.         -webkit-font-smoothing: antialiased;
  726.         content: "\f501";
  727.         display: inline-block;
  728.         font: normal 8px/1 Genericons;
  729.         position: absolute;
  730.         right: 26px;
  731.         top: 14px;
  732.         vertical-align: text-bottom;
  733.     }
  734.  
  735.     .footer-sidebar .widget,
  736.     .primary-sidebar .widget {
  737.         font-size: 12px;
  738.         line-height: 1.5;
  739.     }
  740.  
  741.     .footer-sidebar .widget {
  742.         -webkit-box-sizing: border-box;
  743.         -moz-box-sizing:    border-box;
  744.         box-sizing:         border-box;
  745.         float: left;
  746.         padding: 0 30px;
  747.         width: 25%;
  748.     }
  749.  
  750.     .footer-sidebar .widget h1,
  751.     .primary-sidebar .widget h1 {
  752.         font-size: 20px;
  753.         line-height: 1.2;
  754.     }
  755.  
  756.     .footer-sidebar .widget h2,
  757.     .primary-sidebar .widget h2 {
  758.         font-size: 18px;
  759.         line-height: 1.3333333333;
  760.     }
  761.  
  762.     .footer-sidebar .widget h3,
  763.     .primary-sidebar .widget h3 {
  764.         font-size: 16px;
  765.         line-height: 1.5;
  766.     }
  767.  
  768.     .footer-sidebar .widget h4,
  769.     .primary-sidebar .widget h4 {
  770.         font-size: 14px;
  771.         line-height: 1.7142857142;
  772.     }
  773.  
  774.     .footer-sidebar .widget h5,
  775.     .primary-sidebar .widget h5 {
  776.         font-size: 12px;
  777.         line-height: 2;
  778.     }
  779.  
  780.     .footer-sidebar .widget h6,
  781.     .primary-sidebar .widget h6 {
  782.         font-size: 11px;
  783.         line-height: 2.1818181818;
  784.     }
  785.  
  786.     .footer-sidebar .widget code,
  787.     .footer-sidebar .widget kbd,
  788.     .footer-sidebar .widget tt,
  789.     .footer-sidebar .widget var,
  790.     .footer-sidebar .widget samp,
  791.     .footer-sidebar .widget pre,
  792.     .primary-sidebar .widget code,
  793.     .primary-sidebar .widget kbd,
  794.     .primary-sidebar .widget tt,
  795.     .primary-sidebar .widget var,
  796.     .primary-sidebar .widget samp,
  797.     .primary-sidebar .widget pre {
  798.         font-size: 11px;
  799.         line-height: 1.6363636363;
  800.     }
  801.  
  802.     .footer-sidebar .widget blockquote,
  803.     .primary-sidebar .widget blockquote {
  804.         font-size: 14px;
  805.         line-height: 1.2857142857;
  806.     }
  807.  
  808.     .footer-sidebar .widget blockquote cite,
  809.     .primary-sidebar .widget blockquote cite {
  810.         font-size: 12px;
  811.         line-height: 1.5;
  812.     }
  813.  
  814.     .footer-sidebar .widget input,
  815.     .footer-sidebar .widget textarea,
  816.     .primary-sidebar .widget input,
  817.     .primary-sidebar .widget textarea {
  818.         font-size: 12px;
  819.         padding: 3px 2px 4px 4px;
  820.     }
  821.  
  822.     .footer-sidebar .widget input[type="button"],
  823.     .footer-sidebar .widget input[type="reset"],
  824.     .footer-sidebar .widget input[type="submit"],
  825.     .primary-sidebar .widget input[type="button"],
  826.     .primary-sidebar .widget input[type="reset"],
  827.     .primary-sidebar .widget input[type="submit"] {
  828.         padding: 5px 15px 4px;
  829.     }
  830.  
  831.     .footer-sidebar .widget .widget-title,
  832.     .primary-sidebar .widget .widget-title {
  833.         font-size: 11px;
  834.         font-weight: 900;
  835.         line-height: 1.6363636363;
  836.         margin-bottom: 18px;
  837.     }
  838.  
  839.     .footer-sidebar .widget_twentyfourteen_ephemera .entry-title,
  840.     .footer-sidebar .widget_twentyfourteen_ephemera .entry-meta,
  841.     .footer-sidebar .widget_twentyfourteen_ephemera .wp-caption-text,
  842.     .footer-sidebar .widget_twentyfourteen_ephemera .post-format-archive-link,
  843.     .footer-sidebar .widget_twentyfourteen_ephemera .entry-content table,
  844.     .primary-sidebar .widget_twentyfourteen_ephemera .entry-title,
  845.     .primary-sidebar .widget_twentyfourteen_ephemera .entry-meta,
  846.     .primary-sidebar .widget_twentyfourteen_ephemera .wp-caption-text,
  847.     .primary-sidebar .widget_twentyfourteen_ephemera .post-format-archive-link,
  848.     .primary-sidebar .widget_twentyfourteen_ephemera .entry-content table {
  849.         font-size: 11px;
  850.         line-height: 1.6363636363;
  851.     }
  852.  
  853.     .footer-sidebar .widget_archive li,
  854.     .footer-sidebar .widget_categories li,
  855.     .footer-sidebar .widget_links li,
  856.     .footer-sidebar .widget_meta li,
  857.     .footer-sidebar .widget_nav_menu li,
  858.     .footer-sidebar .widget_pages li,
  859.     .footer-sidebar .widget_recent_comments li,
  860.     .footer-sidebar .widget_recent_entries li,
  861.     .primary-sidebar .widget_archive li,
  862.     .primary-sidebar .widget_categories li,
  863.     .primary-sidebar .widget_links li,
  864.     .primary-sidebar .widget_meta li,
  865.     .primary-sidebar .widget_nav_menu li,
  866.     .primary-sidebar .widget_pages li,
  867.     .primary-sidebar .widget_recent_comments li,
  868.     .primary-sidebar .widget_recent_entries li {
  869.         border-top: 0;
  870.         padding: 0 0 6px;
  871.     }
  872.  
  873.     .footer-sidebar .widget_archive li:last-child,
  874.     .footer-sidebar .widget_categories li:last-child,
  875.     .footer-sidebar .widget_links li:last-child,
  876.     .footer-sidebar .widget_meta li:last-child,
  877.     .footer-sidebar .widget_nav_menu li:last-child,
  878.     .footer-sidebar .widget_pages li:last-child,
  879.     .footer-sidebar .widget_recent_comments li:last-child,
  880.     .footer-sidebar .widget_recent_entries li:last-child,
  881.     .primary-sidebar .widget_archive li:last-child,
  882.     .primary-sidebar .widget_categories li:last-child,
  883.     .primary-sidebar .widget_links li:last-child,
  884.     .primary-sidebar .widget_meta li:last-child,
  885.     .primary-sidebar .widget_nav_menu li:last-child,
  886.     .primary-sidebar .widget_pages li:last-child,
  887.     .primary-sidebar .widget_recent_comments li:last-child,
  888.     .primary-sidebar .widget_recent_entries li:last-child {
  889.         padding: 0;
  890.     }
  891.  
  892.     .footer-sidebar .widget_categories li ul,
  893.     .footer-sidebar .widget_nav_menu li ul,
  894.     .footer-sidebar .widget_pages li ul,
  895.     .primary-sidebar .widget_categories li ul,
  896.     .primary-sidebar .widget_nav_menu li ul,
  897.     .primary-sidebar .widget_pages li ul {
  898.         border-top: 0;
  899.         margin-top: 6px;
  900.     }
  901.  
  902.     #supplementary {
  903.         padding: 0;
  904.     }
  905.  
  906.     .footer-sidebar {
  907.         font-size: 12px;
  908.         line-height: 1.5;
  909.     }
  910.  
  911.     .featured-content {
  912.         padding-left: 182px;
  913.     }
  914.  
  915.     .grid .featured-content .hentry {
  916.         width: 33.3333333%;
  917.     }
  918.  
  919.     .grid .featured-content .hentry:nth-child( 2n+1 ) {
  920.         clear: none;
  921.     }
  922.  
  923.     .grid .featured-content .hentry:nth-child( 3n+1 ) {
  924.         clear: both;
  925.     }
  926.  
  927.     .grid .featured-content .entry-header {
  928.         height: 120px;
  929.     }
  930. }
  931.  
  932. @media screen and (min-width: 1040px) {
  933.     .site-content .has-post-thumbnail .entry-header {
  934.         margin-top: -48px;
  935.     }
  936.  
  937.     .archive-header,
  938.     .comments-area,
  939.     .image-navigation,
  940.     .page-header,
  941.     .page-content,
  942.     .post-navigation,
  943.     .site-content .entry-header,
  944.     .site-content .entry-content,
  945.     .site-content .entry-summary,
  946.     .site-content footer.entry-meta {
  947.         padding-right: 15px;
  948.         padding-left: 15px;
  949.     }
  950.  
  951.     .full-width .archive-header,
  952.     .full-width .comments-area,
  953.     .full-width .image-navigation,
  954.     .full-width .page-header,
  955.     .full-width .page-content,
  956.     .full-width .post-navigation,
  957.     .full-width .site-content .entry-header,
  958.     .full-width .site-content .entry-content,
  959.     .full-width .site-content .entry-summary,
  960.     .full-width .site-content footer.entry-meta {
  961.         padding-right: 30px;
  962.         padding-left: 30px;
  963.     }
  964. }
  965.  
  966. @media screen and (min-width: 1080px) {
  967.     .search-box .search-field {
  968.         width: 324px;
  969.     }
  970.  
  971.     .site-content,
  972.     .site-main .widecolumn {
  973.         margin-left: 222px;
  974.     }
  975.  
  976.     .site:before {
  977.         width: 222px;
  978.     }
  979.  
  980.     .search-box-wrapper,
  981.     .featured-content {
  982.         padding-left: 222px;
  983.     }
  984.  
  985.     #secondary {
  986.         width: 162px;
  987.     }
  988.  
  989.     .secondary-navigation,
  990.     .secondary-navigation ul ul {
  991.         width: 222px;
  992.     }
  993.  
  994.     .secondary-navigation ul li:hover > ul,
  995.     .secondary-navigation ul li.focus > ul {
  996.         left: 202px;
  997.     }
  998.  
  999.     .slider .featured-content .entry-title {
  1000.         font-size: 33px;
  1001.     }
  1002.  
  1003.     .slider .featured-content .entry-header,
  1004.     .slider-control-paging {
  1005.         width: 534px;
  1006.     }
  1007.  
  1008.     .slider-control-paging {
  1009.         padding-left: 24px;
  1010.     }
  1011.  
  1012.     .slider-control-paging li {
  1013.         margin: 12px 12px 12px 0;
  1014.     }
  1015.  
  1016.     .slider-control-paging a {
  1017.         height: 24px;
  1018.         width: 24px;
  1019.     }
  1020.  
  1021.     .slider-control-paging a:before {
  1022.         top: 6px;
  1023.         left: 6px;
  1024.     }
  1025. }
  1026.  
  1027. @media screen and (min-width: 1110px) {
  1028.     .archive-header,
  1029.     .comments-area,
  1030.     .image-navigation,
  1031.     .page-header,
  1032.     .page-content,
  1033.     .post-navigation,
  1034.     .site-content .entry-header,
  1035.     .site-content .entry-content,
  1036.     .site-content .entry-summary,
  1037.     .site-content footer.entry-meta {
  1038.         padding-right: 30px;
  1039.         padding-left: 30px;
  1040.     }
  1041. }
  1042.  
  1043. @media screen and (min-width: 1218px) {
  1044.     .archive-header,
  1045.     .comments-area,
  1046.     .image-navigation,
  1047.     .page-header,
  1048.     .page-content,
  1049.     .post-navigation,
  1050.     .site-content .entry-header,
  1051.     .site-content .entry-content,
  1052.     .site-content .entry-summary,
  1053.     .site-content footer.entry-meta {
  1054.         margin-right: 54px;
  1055.     }
  1056.  
  1057.     .full-width .archive-header,
  1058.     .full-width .comments-area,
  1059.     .full-width .image-navigation,
  1060.     .full-width .page-header,
  1061.     .full-width .page-content,
  1062.     .full-width .post-navigation,
  1063.     .full-width .site-content .entry-header,
  1064.     .full-width .site-content .entry-content,
  1065.     .full-width .site-content .entry-summary,
  1066.     .full-width .site-content footer.entry-meta {
  1067.         margin-right: auto;
  1068.     }
  1069. }
  1070.  
  1071. @media screen and (min-width: 1260px) {
  1072.     .site-content blockquote.alignleft,
  1073.     .site-content blockquote.alignright {
  1074.         width: -webkit-calc(50% + 18px);
  1075.         width:         calc(50% + 18px);
  1076.     }
  1077.  
  1078.     .site-content blockquote.alignleft {
  1079.         margin-left: -18%;
  1080.     }
  1081.  
  1082.     .site-content blockquote.alignright {
  1083.         margin-right: -18%;
  1084.     }
  1085. }
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!