Advertisement
Ratne

Metro Pro

Mar 5th, 2015
48
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 37.79 KB | None | 0 0
  1. /*
  2.     Theme Name: Metro Pro Theme
  3.     Theme URI: http://my.studiopress.com/themes/metro/
  4.     Description: A mobile responsive and HTML5 theme built for the Genesis Framework.
  5.     Author: StudioPress
  6.     Author URI: http://www.studiopress.com/
  7.     Version: 2.0.1
  8.  
  9.     Tags: black, orange, white, one-column, two-columns, three-columns, responsive-layout, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, premise-landing-page
  10.  
  11.     Template: genesis
  12.     Template Version: 2.0.0
  13.  
  14.     License: GPL-2.0+
  15.     License URI: http://www.gnu.org/licenses/gpl-2.0.html
  16. */
  17.  
  18.  
  19. /* Table of Contents
  20.  
  21.     - HTML5 Reset
  22.         - Baseline Normalize
  23.         - Box Sizing
  24.         - Float Clearing
  25.     - Defaults
  26.         - Typographical Elements
  27.         - Headings
  28.         - Objects
  29.         - Forms
  30.         - Tables
  31.     - Structure and Layout
  32.         - Site Containers
  33.         - Column Widths and Positions
  34.         - Column Classes
  35.     - Common Classes
  36.         - WordPress
  37.         - Genesis
  38.         - Titles
  39.     - Widgets
  40.         - Featured Content
  41.     - Plugins
  42.         - Genesis eNews Extended
  43.         - Genesis Latest Tweets
  44.         - Gravity Forms
  45.         - Jetpack
  46.     - Site Header
  47.         - Title Area
  48.         - Widget Area
  49.     - Site Navigation
  50.         - Header Navigation
  51.         - Primary Navigation
  52.         - Secondary Navigation
  53.     - Content Area
  54.         - Home Page
  55.         - Entries
  56.         - After Entry
  57.         - Pagination
  58.         - Comments
  59.     - Sidebars
  60.     - Footer Widgets
  61.     - Site Footer
  62.     - Theme Colors
  63.         - Metro Pro Blue
  64.         - Metro Pro Green
  65.         - Metro Pro Pink
  66.         - Metro Pro Red
  67.     - Media Queries
  68.         - Retina Display
  69.         - max-width: 1139px
  70.         - max-width: 1023px
  71.         - max-width: 767px
  72.         - max-width: 320px
  73.  
  74. */
  75.  
  76.  
  77. /*
  78. HTML5 Reset
  79. ---------------------------------------------------------------------------------------------------- */
  80.  
  81. /* Baseline Reset (normalize.css 2.1.2)
  82.     normalize.css v2.1.2 | MIT License | git.io/normalize
  83. --------------------------------------------- */
  84.  
  85. article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}
  86.  
  87. /* Box Sizing
  88. --------------------------------------------- */
  89.  
  90. *,
  91. input[type="search"] {
  92.     -webkit-box-sizing: border-box;
  93.     -moz-box-sizing:    border-box;
  94.     box-sizing:         border-box;
  95. }
  96.  
  97. /* Float Clearing
  98. --------------------------------------------- */
  99.  
  100. .clearfix:before,
  101. .entry-content:before,
  102. .entry:before,
  103. .footer-widgets:before,
  104. .nav-primary:before,
  105. .nav-secondary:before,
  106. .pagination:before,
  107. .site-container:before,
  108. .site-footer:before,
  109. .site-header:before,
  110. .site-inner:before,
  111. .widget:before,
  112. .wrap:before {
  113.     content: " ";
  114.     display: table;
  115. }
  116.  
  117. .clearfix:after,
  118. .entry-content:after,
  119. .entry:after,
  120. .footer-widgets:after,
  121. .nav-primary:after,
  122. .nav-secondary:after,
  123. .pagination:after,
  124. .site-container:after,
  125. .site-footer:after,
  126. .site-header:after,
  127. .site-inner:after,
  128. .widget:after,
  129. .wrap:after {
  130.     clear: both;
  131.     content: " ";
  132.     display: table;
  133. }
  134.  
  135.  
  136. /*
  137. Defaults
  138. ---------------------------------------------------------------------------------------------------- */
  139.  
  140. /* Typographical Elements
  141. --------------------------------------------- */
  142.  
  143. body {
  144.     background-color: #fff;
  145.     color: #222;
  146.     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  147.     font-size: 16px;
  148.     font-weight: 300;
  149.     line-height: 1.625;
  150. }
  151.  
  152. a,
  153. button,
  154. input:focus,
  155. input[type="button"],
  156. input[type="reset"],
  157. input[type="submit"],
  158. textarea:focus,
  159. .button {
  160.     -webkit-transition: all 0.1s ease-in-out;
  161.     -moz-transition:    all 0.1s ease-in-out;
  162.     -ms-transition:     all 0.1s ease-in-out;
  163.     -o-transition:      all 0.1s ease-in-out;
  164.     transition:         all 0.1s ease-in-out;
  165. }
  166.  
  167. ::-moz-selection {
  168.     background-color: #333;
  169.     color: #fff;
  170. }
  171.  
  172. ::selection {
  173.     background-color: #333;
  174.     color: #fff;
  175. }
  176.  
  177. a {
  178.     color: #f96e5b;
  179. }
  180.  
  181. a:hover {
  182.     color: #222;
  183. }
  184.  
  185. p {
  186.     margin: 0 0 16px;
  187.     padding: 0;
  188. }
  189.  
  190. ol,
  191. ul {
  192.     margin: 0;
  193.     padding: 0;
  194. }
  195.  
  196. blockquote,
  197. blockquote::before {
  198.     color: #999;
  199. }
  200.  
  201. blockquote {
  202.     margin: 0;
  203.     padding: 24px 40px;
  204. }
  205.  
  206. blockquote::before {
  207.     content: "\201C";
  208.     display: block;
  209.     font-size: 30px;
  210.     height: 0;
  211.     left: -20px;
  212.     position: relative;
  213.     top: -10px;
  214. }
  215.  
  216. .entry-content code {
  217.     background-color: #333;
  218.     color: #ddd;
  219. }
  220.  
  221. cite {
  222.     font-style: normal;
  223. }
  224.  
  225. /* Headings
  226. --------------------------------------------- */
  227.  
  228. h1,
  229. h2,
  230. h3,
  231. h4,
  232. h5,
  233. h6 {
  234.     color: #333;
  235.     font-weight: 400;
  236.     line-height: 1.2;
  237.     margin: 0 0 16px;
  238.     padding: 0;
  239. }
  240.  
  241. h1 {
  242.     font-size: 48px;
  243. }
  244.  
  245. h2 {
  246.     font-size: 24px;
  247. }
  248.  
  249. h3 {
  250.     font-size: 20px;
  251. }
  252.  
  253. h4 {
  254.     font-size: 20px;
  255. }
  256.  
  257. h5 {
  258.     font-size: 18px;
  259. }
  260.  
  261. h6 {
  262.     font-size: 16px;
  263. }
  264.  
  265. /* Objects
  266. --------------------------------------------- */
  267.  
  268. embed,
  269. iframe,
  270. img,
  271. object,
  272. video,
  273. .wp-caption {
  274.     max-width: 100%;
  275. }
  276.  
  277. img {
  278.     height: auto;
  279. }
  280.  
  281. .featured-content img,
  282. .gallery img {
  283.     width: auto; /* IE8 */
  284. }
  285.  
  286. /* Forms
  287. --------------------------------------------- */
  288.  
  289. input,
  290. select,
  291. textarea {
  292.     background-color: #f5f5f5;
  293.     border: 1px solid #ddd;
  294.     box-shadow: 0 0 5px #ddd inset;
  295.     color: #999;
  296.     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  297.     font-size: 14px;
  298.     padding: 16px;
  299.     width: 100%;
  300. }
  301.  
  302. input[type="checkbox"],
  303. input[type="radio"],
  304. input[type="image"] {
  305.     width: auto;
  306. }
  307.  
  308. input:focus,
  309. textarea:focus {
  310.     border: 1px solid #999;
  311.     outline: none;
  312. }
  313.  
  314. ::-moz-placeholder {
  315.     color: #999;
  316.     opacity: 1;
  317. }
  318.  
  319. ::-webkit-input-placeholder {
  320.     color: #999;
  321. }
  322.  
  323. button,
  324. input[type="button"],
  325. input[type="reset"],
  326. input[type="submit"],
  327. .button,
  328. .entry-content .button {
  329.     background-color: #333;
  330.     border: none;
  331.     box-shadow: none;
  332.     color: #fff;
  333.     cursor: pointer;
  334.     padding: 16px 24px;
  335.     text-decoration: none;
  336.     text-transform: uppercase;
  337.     width: auto;
  338. }
  339.  
  340. button:hover,
  341. input:hover[type="button"],
  342. input:hover[type="reset"],
  343. input:hover[type="submit"],
  344. .button:hover,
  345. .entry-content .button:hover {
  346.     color: #fff;
  347.     background-color: #f96e5b;
  348. }
  349.  
  350. .entry-content .button:hover {
  351.     color: #fff;
  352. }
  353.  
  354. .button {
  355.     display: inline-block;
  356. }
  357.  
  358. input[type="search"]::-webkit-search-cancel-button,
  359. input[type="search"]::-webkit-search-results-button {
  360.     display: none;
  361. }
  362.  
  363. /* Tables
  364. --------------------------------------------- */
  365.  
  366. table {
  367.     border-collapse: collapse;
  368.     border-spacing: 0;
  369.     line-height: 2;
  370.     margin-bottom: 40px;
  371.     width: 100%;
  372. }
  373.  
  374. tbody {
  375.     border-bottom: 1px solid #ddd;
  376. }
  377.  
  378. th,
  379. td {
  380.     text-align: left;
  381. }
  382.  
  383. th {
  384.     font-weight: bold;
  385.     text-transform: uppercase;
  386. }
  387.  
  388. td {
  389.     border-top: 1px solid #ddd;
  390.     padding: 6px 0;
  391. }
  392.  
  393.  
  394. /*
  395. Structure and Layout
  396. ---------------------------------------------------------------------------------------------------- */
  397.  
  398. /* Site Containers
  399. --------------------------------------------- */
  400.  
  401. .site-container {
  402.     background-color: #fff;
  403.     margin: 32px auto;
  404.     max-width: 1140px;
  405.     overflow: hidden;
  406.     padding: 36px;
  407. }
  408.  
  409. .site-inner {
  410.     clear: both;
  411.     padding-top: 32px;
  412. }
  413.  
  414. .wrap {
  415.     margin: 0 auto;
  416.     max-width: 1140px;
  417. }
  418.  
  419. /* Column Widths and Positions
  420. --------------------------------------------- */
  421.  
  422. /* Wrapping div for .content and .sidebar-primary */
  423.  
  424. .content-sidebar-sidebar .content-sidebar-wrap,
  425. .sidebar-content-sidebar .content-sidebar-wrap,
  426. .sidebar-sidebar-content .content-sidebar-wrap {
  427.     width: 868px;
  428. }
  429.  
  430. .content-sidebar-sidebar .content-sidebar-wrap {
  431.     float: left;
  432. }
  433.  
  434. .sidebar-content-sidebar .content-sidebar-wrap,
  435. .sidebar-sidebar-content .content-sidebar-wrap {
  436.     float: right;
  437. }
  438.  
  439. /* Content */
  440.  
  441. .content {
  442.     float: right;
  443.     width: 700px;
  444. }
  445.  
  446. .content-sidebar .content,
  447. .content-sidebar-sidebar .content,
  448. .sidebar-content-sidebar .content {
  449.     float: left;
  450. }
  451.  
  452. .content-sidebar-sidebar .content,
  453. .sidebar-content-sidebar .content,
  454. .sidebar-sidebar-content .content {
  455.     width: 500px;
  456. }
  457.  
  458. .full-width-content .content {
  459.     width: 100%;
  460. }
  461.  
  462. .metro-pro-landing .site-container {
  463.     max-width: 772px;
  464. }
  465.  
  466. .metro-pro-landing .site-inner,
  467. .metro-pro-landing .entry {
  468.     padding: 0;
  469. }
  470.  
  471. /* Primary Sidebar */
  472.  
  473. .sidebar-primary {
  474.     float: right;
  475.     width: 332px;
  476. }
  477.  
  478. .sidebar-content .sidebar-primary,
  479. .sidebar-sidebar-content .sidebar-primary {
  480.     float: left;
  481. }
  482.  
  483. /* Secondary Sidebar */
  484.  
  485. .sidebar-secondary {
  486.     float: left;
  487.     width: 164px;
  488. }
  489.  
  490. .content-sidebar-sidebar .sidebar-secondary {
  491.     float: right;
  492. }
  493.  
  494.  
  495. /* Column Classes
  496. --------------------------------------------- */
  497.  
  498. .five-sixths,
  499. .four-sixths,
  500. .one-fourth,
  501. .one-half,
  502. .one-sixth,
  503. .one-third,
  504. .three-fourths,
  505. .three-sixths,
  506. .two-fourths,
  507. .two-sixths,
  508. .two-thirds {
  509.     float: left;
  510.     margin-left: 2.564102564102564%;
  511. }
  512.  
  513. .one-half,
  514. .three-sixths,
  515. .two-fourths {
  516.     width: 48.717948717948715%;
  517. }
  518.  
  519. .one-third,
  520. .two-sixths {
  521.     width: 31.623931623931625%;
  522. }
  523.  
  524. .four-sixths,
  525. .two-thirds {
  526.     width: 65.81196581196582%;
  527. }
  528.  
  529. .one-fourth {
  530.     width: 23.076923076923077%;
  531. }
  532.  
  533. .three-fourths {
  534.     width: 74.35897435897436%;
  535. }
  536.  
  537. .one-sixth {
  538.     width: 14.52991452991453%;
  539. }
  540.  
  541. .five-sixths {
  542.     width: 82.90598290598291%;
  543. }
  544.  
  545. .first {
  546.     clear: both;
  547.     margin-left: 0;
  548. }
  549.  
  550.  
  551. /*
  552. Common Classes
  553. ---------------------------------------------------------------------------------------------------- */
  554.  
  555. /* WordPress
  556. --------------------------------------------- */
  557.  
  558. .avatar {
  559.     float: left;
  560. }
  561.  
  562. .alignleft .avatar {
  563.     margin-right: 24px;
  564. }
  565.  
  566. .alignright .avatar {
  567.     margin-left: 24px;
  568. }
  569.  
  570. .search-form {
  571.     overflow: hidden;
  572.     width: 100%;
  573. }
  574.  
  575. .search-form input[type="search"] {
  576.     background: #f5f5f5 url(images/search.png) no-repeat 15px 16px;
  577.     background-size: 15px 15px;
  578.     padding: 16px 16px 16px 44px;
  579. }
  580.  
  581. .search-form input[type="submit"] {
  582.     border: 0;
  583.     clip: rect(0, 0, 0, 0);
  584.     height: 1px;
  585.     margin: -1px;
  586.     padding: 0;
  587.     position: absolute;
  588.     width: 1px;
  589. }
  590.  
  591. img.centered,
  592. .aligncenter {
  593.     display: block;
  594.     margin: 0 auto 12px;
  595. }
  596.  
  597. a.alignnone img,
  598. img.alignnone {
  599.     margin-bottom: 12px;
  600. }
  601.  
  602. .alignleft {
  603.     float: left;
  604.     text-align: left;
  605. }
  606.  
  607. .alignright {
  608.     float: right;
  609.     text-align: right;
  610. }
  611.  
  612. a.alignleft,
  613. a.alignright {
  614.     max-width: 100%;
  615. }
  616.  
  617. a.alignleft img,
  618. img.alignleft,
  619. .wp-caption.alignleft {
  620.     margin: 0 24px 12px 0;
  621. }
  622.  
  623. a.alignright img,
  624. img.alignright,
  625. .wp-caption.alignright {
  626.     margin: 0 0 24px 24px;
  627. }
  628.  
  629. .wp-caption-text {
  630.     font-size: 14px;
  631.     margin: 0;
  632.     text-align: center;
  633. }
  634.  
  635. .widget_calendar table {
  636.     width: 100%;
  637. }
  638.  
  639. .widget_calendar td {
  640.     text-align: center;
  641. }
  642.  
  643. /* Genesis
  644. --------------------------------------------- */
  645.  
  646. .breadcrumb {
  647.     margin-bottom: 20px;
  648. }
  649.  
  650. .archive-description,
  651. .author-box,
  652. .sticky {
  653.     background-color: #f5f5f5;
  654.     margin-bottom: 48px;
  655.     overflow: hidden;
  656.     padding: 32px;
  657. }
  658.  
  659. .author-box p {
  660.     margin: 0;
  661. }
  662.  
  663. .author-box .avatar {
  664.     margin-right: 24px;
  665. }
  666.  
  667. .author-box h1 {
  668.     font-size: 16px;
  669.     margin-bottom: 4px;
  670. }
  671.  
  672. /* Titles
  673. --------------------------------------------- */
  674.  
  675. .entry-title {
  676.     font-size: 48px;
  677.     font-weight: 700;
  678. }
  679.  
  680. .entry-title a,
  681. .sidebar .widget-title a {
  682.     color: #333;
  683.     text-decoration: none;
  684. }
  685.  
  686. .entry-title a:hover {
  687.     color: #f96e5b;
  688. }
  689.  
  690. .content .home-top .entry-title {
  691.     font-size: 24px;
  692. }
  693.  
  694. .after-entry .widget-title,
  695. .archive-title,
  696. .comments-title,
  697. .widget .entry-title {
  698.     font-size: 20px;
  699. }
  700.  
  701. .comment-respond h3,
  702. .entry-comments h3,
  703. .widget-title {
  704.     background: url(images/lines.png) bottom repeat-x;
  705.     font-family: 'Oswald', sans-serif;
  706.     font-size: 16px;
  707.     line-height: 1;
  708.     margin-bottom: 16px;
  709.     padding-bottom: 16px;
  710.     text-align: center;
  711.     text-transform: uppercase;
  712. }
  713.  
  714. .comment-respond h3:before,
  715. .entry-comments h3:before,
  716. .widget-title:before {
  717.     margin-right: 10px;
  718. }
  719.  
  720. .comment-respond h3:after,
  721. .entry-comments h3:after,
  722. .widget-title:after {
  723.     margin-left: 10px;
  724. }
  725.  
  726. .after-entry .widget-title,
  727. .enews-widget .widget-title {
  728.     background: none;
  729.     text-shadow: none;
  730. }
  731.  
  732.  
  733. /*
  734. Widgets
  735. ---------------------------------------------------------------------------------------------------- */
  736.  
  737. /* Featured Content
  738. --------------------------------------------- */
  739.  
  740. .featured-content .entry {
  741.     background: none;
  742.     margin-bottom: 16px;
  743.     padding: 0;
  744. }
  745.  
  746. .featured-content .entry p,
  747. .home-bottom .featured-content {
  748.     margin-bottom: 0;
  749. }
  750.  
  751. .featured-content .entry-title {
  752.     margin-bottom: 8px;
  753. }
  754.  
  755. .home-bottom .featured-content .entry-title {
  756.     margin: 8px 0;
  757. }
  758.  
  759. .home-bottom .featured-content .widget-title {
  760.     margin-bottom: 20px;
  761. }
  762.  
  763. .home-bottom .featured-content .entry {
  764.     border-bottom: 5px solid #f5f5f5;
  765. }
  766.  
  767. .metro-pro-home .home-bottom .entry {
  768.     margin-bottom: 20px;
  769.     padding-bottom: 20px;
  770. }
  771.  
  772. .home-bottom .featured-content .entry-content p,
  773. .home-bottom .featured-content img {
  774.     margin-bottom: 0;
  775. }
  776.  
  777.  
  778. /*
  779. Plugins
  780. ---------------------------------------------------------------------------------------------------- */
  781.  
  782. /* Genesis eNews Extended
  783. --------------------------------------------- */
  784.  
  785. .sidebar .enews-widget {
  786.     background-color: #333;
  787.     color: #fff;
  788.     padding: 28px 32px 32px;
  789. }
  790.  
  791. .sidebar .enews-widget .widget-title {
  792.     color: #fff;
  793. }
  794.  
  795. .sidebar .enews-widget input {
  796.     margin-bottom: 16px;
  797. }
  798.  
  799. .sidebar .enews-widget input[type="submit"] {
  800.     background-color: #f96e5b;
  801.     color: #fff;
  802.     margin: 0;
  803.     width: 100%;
  804. }
  805.  
  806. .sidebar .enews-widget input:hover[type="submit"] {
  807.     background-color: #fff;
  808.     color: #333;
  809. }
  810.  
  811. .sidebar .enews-widget input {
  812.     background-color: #fff;
  813.     box-shadow: none;
  814.     margin-bottom: 12px;
  815. }
  816.  
  817. .after-entry .enews-widget input {
  818.     width: 50%;
  819. }
  820.  
  821. .after-entry .enews-widget input[type="submit"] {
  822.     width: auto;
  823. }
  824.  
  825. /* Genesis Latest Tweets
  826. --------------------------------------------- */
  827.  
  828. .latest-tweets ul li {
  829.     margin-bottom: 16px;
  830. }
  831.  
  832. /* Gravity Forms
  833. --------------------------------------------- */
  834.  
  835. .site-inner div.gform_wrapper input[type="text"],
  836. .site-inner div.gform_wrapper textarea,
  837. .site-inner div.gform_wrapper .ginput_complex label {
  838.     font-size: 16px;
  839.     padding: 16px;
  840. }
  841.  
  842. .site-inner div.gform_wrapper .ginput_complex label {
  843.     padding: 0;
  844. }
  845.  
  846. div.gform_wrapper li,
  847. div.gform_wrapper form li {
  848.     margin: 16px 0 0;
  849. }
  850.  
  851. .site-inner div.gform_wrapper input[type="submit"] {
  852.     font-size: 14px;
  853. }
  854.  
  855. /* Jetpack
  856. --------------------------------------------- */
  857.  
  858. img#wpstats {
  859.     display: none;
  860. }
  861.  
  862.  
  863. /*
  864. Site Header
  865. ---------------------------------------------------------------------------------------------------- */
  866.  
  867. .site-header {
  868.     background-color: #fff;
  869.     padding: 0;
  870.     overflow: hidden;
  871. }
  872.  
  873. .header-image .site-header {
  874.     padding: 0;
  875. }
  876.  
  877. /* Title Area
  878. --------------------------------------------- */
  879.  
  880. .title-area {
  881.     float: left;
  882.     padding: 0;
  883.     width: 360px;
  884. }
  885.  
  886. .site-title {
  887.     font-family: 'Oswald', sans-serif;
  888.     font-size: 48px;
  889.     line-height: 1;
  890.     margin: 0 0 16px;
  891.     text-transform: uppercase;
  892. }
  893.  
  894. .site-title a,
  895. .site-title a:hover {
  896.     background-color: #f96e5b;
  897.     color: #fff;
  898.     display: inline-block;
  899.     padding: 16px;
  900.     text-decoration: none;
  901. }
  902.  
  903. .site-description {
  904.     display: block;
  905.     height: 0;
  906.     margin-bottom: 0;
  907.     text-indent: -9999px;
  908. }
  909.  
  910. /* Full width header, no widgets */
  911.  
  912. .header-full-width .title-area,
  913. .header-full-width .site-title {
  914.     width: 100%;
  915. }
  916.  
  917. .header-image .site-description,
  918. .header-image .site-title a {
  919.     display: block;
  920.     text-indent: -9999px;
  921. }
  922.  
  923. /* Logo, hide text */
  924.  
  925. .header-image .site-title,
  926. .header-image .title-area {
  927.     min-height: 100px;
  928.     padding: 0;
  929. }
  930.  
  931. .header-image .site-title a {
  932.     background-color: none;
  933.     max-width: 270px;
  934.     min-height: 80px;
  935.     padding: 0;
  936. }
  937.  
  938. /* Widget Area
  939. --------------------------------------------- */
  940.  
  941. .site-header .widget-area {
  942.     float: right;
  943.     width: 664px;
  944. }
  945.  
  946. .site-header .search-form {
  947.     float: right;
  948.     margin-top: 16px;
  949.     width: 50%;
  950. }
  951.  
  952.  
  953. /*
  954. Site Navigation
  955. ---------------------------------------------------------------------------------------------------- */
  956.  
  957. .genesis-nav-menu {
  958.     clear: both;
  959.     color: #fff;
  960.     font-size: 14px;
  961.     line-height: 1;
  962.     margin: 0;
  963.     padding: 0;
  964.     width: 100%;
  965. }
  966.  
  967. .genesis-nav-menu .menu-item {
  968.     border: none;
  969.     display: inline-block;
  970.     margin: 0;
  971.     padding: 0;
  972.     text-align: left;
  973. }
  974.  
  975. .genesis-nav-menu a {
  976.     color: #fff;
  977.     display: block;
  978.     padding: 16px 20px 14px;
  979.     position: relative;
  980.     text-decoration: none;
  981. }
  982.  
  983. .genesis-nav-menu a:hover,
  984. .genesis-nav-menu .current-menu-item > a {
  985.     background-color: #f96e5b;
  986.     color: #fff;
  987. }
  988.  
  989. .genesis-nav-menu .sub-menu {
  990.     left: -9999px;
  991.     margin: 0;
  992.     opacity: 0;
  993.     padding: 0;
  994.     position: absolute;
  995.     -webkit-transition: opacity .4s ease-in-out;
  996.     -moz-transition:    opacity .4s ease-in-out;
  997.     -ms-transition:     opacity .4s ease-in-out;
  998.     -o-transition:      opacity .4s ease-in-out;
  999.     transition:         opacity .4s ease-in-out;
  1000.     width: 175px;
  1001.     z-index: 99;
  1002. }
  1003.  
  1004. .genesis-nav-menu .sub-menu a {
  1005.     background-color: #333;
  1006.     font-size: 12px;
  1007.     padding: 12px 16px;
  1008.     position: relative;
  1009.     width: 175px;
  1010. }
  1011.  
  1012. .genesis-nav-menu .sub-menu .sub-menu {
  1013.     margin: -36px 0 0 174px;
  1014. }
  1015.  
  1016. .genesis-nav-menu .menu-item:hover {
  1017.     position: static;
  1018. }
  1019.  
  1020. .genesis-nav-menu .menu-item:hover > .sub-menu {
  1021.     left: auto;
  1022.     opacity: 1;
  1023. }
  1024.  
  1025. .genesis-nav-menu > .right {
  1026.     display: inline-block;
  1027.     float: right;
  1028.     list-style-type: none;
  1029.     padding: 16px 20px 14px;
  1030.     text-transform: uppercase;
  1031. }
  1032.  
  1033. .genesis-nav-menu > .right > a {
  1034.     background: none;
  1035.     display: inline;
  1036.     padding: 0;
  1037. }
  1038.  
  1039. .genesis-nav-menu > .right > a:hover {
  1040.     color: #f96e5b;
  1041. }
  1042.  
  1043. .genesis-nav-menu > .rss > a {
  1044.     margin-left: 48px;
  1045. }
  1046.  
  1047. .genesis-nav-menu > .search {
  1048.     padding: 0;
  1049. }
  1050.  
  1051. .genesis-nav-menu .search-form {
  1052.     width: 100%;
  1053. }
  1054.  
  1055. .genesis-nav-menu .search-form input[type="search"] {
  1056.     font-size: 12px;
  1057.     padding: 14px 14px 14px 44px;
  1058. }
  1059.  
  1060. /* Site Header Navigation
  1061. --------------------------------------------- */
  1062.  
  1063. .site-header ul.genesis-nav-menu {
  1064.     background-color: #333;
  1065. }
  1066.  
  1067. .site-header .sub-menu .sub-menu {
  1068.     margin-top: -55px;
  1069. }
  1070.  
  1071. /* Primary Navigation
  1072. --------------------------------------------- */
  1073.  
  1074. .nav-primary {
  1075.     background-color: #333;
  1076. }
  1077.  
  1078. .nav-primary a {
  1079.     text-transform: uppercase;
  1080. }
  1081.  
  1082. .nav-primary a:hover,
  1083. .nav-primary .current-menu-item > a {
  1084.     color: #fff;
  1085. }
  1086.  
  1087. .nav-primary .sub-menu a {
  1088.     padding: 16px 20px;
  1089. }
  1090.  
  1091. .nav-primary .sub-menu a:hover {
  1092.     background-color: #f96e5b;
  1093.     color: #fff;
  1094. }
  1095.  
  1096. .nav-primary .sub-menu .sub-menu {
  1097.     margin: -44px 0 0 174px;
  1098. }
  1099.  
  1100. /* Secondary Navigation
  1101. --------------------------------------------- */
  1102.  
  1103. .nav-secondary {
  1104.     background-color: #333;
  1105.     text-align: right;
  1106. }
  1107.  
  1108. .nav-secondary a {
  1109.     font-size: 12px;
  1110.     font-weight: 700;
  1111.     line-height: 1;
  1112.     padding: 16px;
  1113. }
  1114.  
  1115. .nav-secondary .sub-menu a:hover {
  1116.     background-color: #f96e5b;
  1117.     color: #fff;
  1118. }
  1119.  
  1120.  
  1121. /*
  1122. Content Area
  1123. ---------------------------------------------------------------------------------------------------- */
  1124.  
  1125. /* Home Page
  1126. --------------------------------------------- */
  1127.  
  1128. .home-middle {
  1129.     overflow: hidden;
  1130. }
  1131.  
  1132. .home-middle-left,
  1133. .home-middle-right {
  1134.     width: 332px;
  1135. }
  1136.  
  1137. .home-middle-left {
  1138.     float: left;
  1139. }
  1140.  
  1141. .home-middle-right {
  1142.     float: right;
  1143. }
  1144.  
  1145. /* Entries
  1146. --------------------------------------------- */
  1147.  
  1148. .entry,
  1149. .page.page-template-page_blog-php .entry {
  1150.     background: url(images/lines.png) bottom repeat-x;
  1151.     background-size: 8px 8px;
  1152.     margin-bottom: 48px;
  1153.     padding-bottom: 32px;
  1154. }
  1155.  
  1156. .page .entry {
  1157.     background: none;
  1158. }
  1159.  
  1160. .single .entry {
  1161.     background: none;
  1162.     margin-bottom: 32px;
  1163.     padding: 0;
  1164. }
  1165.  
  1166. .entry-content a {
  1167.     color: #f96e5b;
  1168. }
  1169.  
  1170. .entry-content a:hover {
  1171.     color: #333;
  1172. }
  1173.  
  1174. .entry-content ol,
  1175. .entry-content p,
  1176. .entry-content ul,
  1177. .quote-caption {
  1178.     margin-bottom: 26px;
  1179. }
  1180.  
  1181. .entry-content ol li,
  1182. .entry-content ul li {
  1183.     margin-left: 40px;
  1184. }
  1185.  
  1186. .entry-content ol > li {
  1187.     list-style-type: decimal;
  1188. }
  1189.  
  1190. .entry-content ul > li {
  1191.     list-style-type: disc;
  1192. }
  1193.  
  1194. .entry-content ol ol,
  1195. .entry-content ul ul,
  1196. .entry-content .wp-caption p {
  1197.     margin-bottom: 0;
  1198. }
  1199.  
  1200. .entry-meta {
  1201.     color: #999;
  1202.     font-size: 12px;
  1203.     text-transform: uppercase;
  1204. }
  1205.  
  1206. .entry-meta a {
  1207.     color: #999;
  1208.     text-decoration: none;
  1209. }
  1210.  
  1211. .entry-meta a:hover {
  1212.     color: #222;
  1213. }
  1214.  
  1215. .entry-header .entry-meta {
  1216.     margin-bottom: 24px;
  1217. }
  1218.  
  1219. .entry-meta .entry-comments::before {
  1220.     margin: 0 6px 0 2px;
  1221. }
  1222.  
  1223. .entry-meta .entry-categories,
  1224. .entry-meta .entry-tags {
  1225.     display: block;
  1226. }
  1227.  
  1228. .content .entry-meta .entry-comments-link {
  1229.     float: right;
  1230. }
  1231.  
  1232. .content .entry-meta .entry-comments-link a {
  1233.     background-color: #f96e5b;
  1234.     color: #fff;
  1235.     padding: 8px 16px;
  1236. }
  1237.  
  1238. .content .entry-meta .entry-comments-link a:hover {
  1239.     background-color: #333;
  1240.     color: #fff;
  1241. }
  1242.  
  1243. /* After Entry
  1244. --------------------------------------------- */
  1245.  
  1246. .after-entry,
  1247. .after-entry .wrap {
  1248.     overflow: hidden;
  1249. }
  1250.  
  1251. .after-entry {
  1252.     background: url(images/lines.png);
  1253.     background-size: 8px 8px;
  1254.     margin-top: 32px;
  1255.     padding: 16px;
  1256.     text-align: center;
  1257. }
  1258.  
  1259. .after-entry .wrap {
  1260.     background-color: #fff;
  1261.     padding: 32px;
  1262. }
  1263.  
  1264. .after-entry p {
  1265.     margin-bottom: 20px;
  1266. }
  1267.  
  1268. /* Pagination
  1269. --------------------------------------------- */
  1270.  
  1271. .archive-pagination {
  1272.     font-size: 14px;
  1273.     margin: 40px 0;
  1274. }
  1275.  
  1276. .archive-pagination li {
  1277.     display: inline;
  1278. }
  1279.  
  1280. .archive-pagination li a {
  1281.     background-color: #333;
  1282.     color: #fff;
  1283.     cursor: pointer;
  1284.     display: inline-block;
  1285.     padding: 8px 12px;
  1286.     text-decoration: none;
  1287. }
  1288.  
  1289. .archive-pagination li a:hover,
  1290. .archive-pagination li.active a {
  1291.     background-color: #f96e5b;
  1292. }
  1293.  
  1294. /* Comments
  1295. --------------------------------------------- */
  1296.  
  1297. .entry-comments,
  1298. .entry-pings {
  1299.     margin-bottom: 40px;
  1300. }
  1301.  
  1302. p.form-submit,
  1303. .entry-comments .comment-author {
  1304.     margin-bottom: 0;
  1305. }
  1306.  
  1307. .comment-respond input[type="email"],
  1308. .comment-respond input[type="text"],
  1309. .comment-respond input[type="url"] {
  1310.     width: 50%
  1311. }
  1312.  
  1313. .comment-respond label {
  1314.     display: block;
  1315.     margin-right: 12px;
  1316. }
  1317.  
  1318. .comment-list li {
  1319.     list-style-type: none;
  1320.     margin-top: 24px;
  1321.     padding: 32px;
  1322. }
  1323.  
  1324. .ping-list li {
  1325.     list-style-type: none;
  1326.     margin: 0;
  1327.     padding: 20px 0;
  1328. }
  1329.  
  1330. .ping-list .reply {
  1331.     display: none;
  1332. }
  1333.  
  1334. .comment-list li li {
  1335.     margin-right: -32px;
  1336. }
  1337.  
  1338. .comment {
  1339.     background-color: #f5f5f5;
  1340.     border: 2px solid #fff;
  1341.     border-right: none;
  1342. }
  1343.  
  1344. .comment-content {
  1345.     clear: both;
  1346. }
  1347.  
  1348. .comment .avatar {
  1349.     margin: 0 16px 24px 0;
  1350. }
  1351.  
  1352. .form-allowed-tags {
  1353.     background-color: #f5f5f5;
  1354.     font-size: 14px;
  1355.     padding: 24px;
  1356. }
  1357.  
  1358. p.subscribe-to-comments {
  1359.     padding: 24px 0 16px;
  1360. }
  1361.  
  1362.  
  1363. /*
  1364. Widgets
  1365. ---------------------------------------------------------------------------------------------------- */
  1366.  
  1367. .widget {  
  1368.     margin-bottom: 32px;
  1369.     word-wrap: break-word;
  1370. }
  1371.  
  1372. .widget li {
  1373.     border-bottom: 1px dotted #ececec;
  1374.     margin-bottom: 10px;
  1375.     padding-bottom: 10px;
  1376.     text-align: left;
  1377. }
  1378.  
  1379. .widget ol > li {
  1380.     list-style-position: inside;
  1381.     list-style-type: decimal;
  1382.     padding-left: 20px;
  1383.     text-indent: -20px;
  1384. }
  1385.  
  1386. .widget ul > li {
  1387.     list-style-type: none;
  1388.     text-indent: 0;
  1389. }
  1390.  
  1391. .widget li li {
  1392.     border: none;
  1393.     margin: 0 0 0 30px;
  1394.     padding: 0;
  1395. }
  1396.  
  1397. .widget ul > li:last-child,
  1398. .widget p:last-child {
  1399.     margin-bottom: 0;
  1400. }
  1401.  
  1402.  
  1403. /*
  1404. Sidebars
  1405. ---------------------------------------------------------------------------------------------------- */
  1406.  
  1407. .sidebar {
  1408.     display: inline;
  1409.     font-size: 15px;
  1410. }
  1411.  
  1412. .sidebar p:last-child,
  1413. .sidebar ul {
  1414.     margin: 0;
  1415. }
  1416.  
  1417. .sidebar .search-form {
  1418.     width: 100%;
  1419. }
  1420.  
  1421. a.social-buttons {
  1422.     background-color: #333;
  1423.     border-right: 1px solid #fff;
  1424.     color: #fff;
  1425.     float: left;
  1426.     font-size: 10px;
  1427.     overflow: hidden;
  1428.     padding: 8px 0;
  1429.     text-align: center;
  1430.     text-decoration: none;
  1431.     text-transform: uppercase;
  1432.     width: 25%;
  1433. }
  1434.  
  1435. a.social-buttons.last {
  1436.     border: none;
  1437. }
  1438.  
  1439. a.social-buttons:hover {
  1440.     background-color: #f96e5b;
  1441. }
  1442.  
  1443.  
  1444. /*
  1445. Footer Widgets
  1446. ---------------------------------------------------------------------------------------------------- */
  1447.  
  1448. .footer-widgets {
  1449.     background-color: #fff;
  1450.     clear: both;
  1451.     font-size: 15px;
  1452.     margin: 32px auto;
  1453.     max-width: 1140px;
  1454.     padding: 36px 36px 0;
  1455. }
  1456.  
  1457. .footer-widgets-1,
  1458. .footer-widgets-2,
  1459. .footer-widgets-3 {
  1460.     width: 332px;
  1461. }
  1462.  
  1463. .footer-widgets-1 {
  1464.     margin-right: 36px;
  1465. }
  1466.  
  1467. .footer-widgets-1,
  1468. .footer-widgets-2 {
  1469.     float: left;
  1470. }
  1471.  
  1472. .footer-widgets-3 {
  1473.     float: right;
  1474. }
  1475.  
  1476. .footer-widgets .widget {
  1477.     margin-bottom: 36px;
  1478. }
  1479.  
  1480. .footer-widgets .search-form {
  1481.     width: 100%;
  1482. }
  1483.  
  1484.  
  1485. /*
  1486. Site Footer
  1487. ---------------------------------------------------------------------------------------------------- */
  1488.  
  1489. .site-footer {
  1490.     background-color: #333;
  1491.     color: #fff;
  1492.     font-size: 12px;
  1493.     font-weight: 700;
  1494.     padding: 16px;
  1495.     text-align: center;
  1496. }
  1497.  
  1498. .site-footer a {
  1499.     color: #fff;
  1500.     text-decoration: none; 
  1501. }
  1502.  
  1503. .site-footer a:hover {
  1504.     color: #f96e5b;
  1505. }
  1506.  
  1507. .site-footer p {
  1508.     margin: 0;
  1509. }
  1510.  
  1511. /*
  1512. Theme Colors
  1513. ---------------------------------------------------------------------------------------------------- */
  1514.  
  1515. /* Metro Pro Blue
  1516. --------------------------------------------- */
  1517.  
  1518. .metro-pro-blue .entry-title a:hover,
  1519. .metro-pro-blue .genesis-nav-menu > .right > a:hover,
  1520. .metro-pro-blue .site-footer a:hover,
  1521. .metro-pro-blue a,
  1522. .metro-pro-blue h2 a:hover {
  1523.     color: #5bb1f9;
  1524. }
  1525.  
  1526. .metro-pro-blue .entry-title a,
  1527. .metro-pro-blue .entry-meta a:hover,
  1528. .metro-pro-blue a:hover {
  1529.     color: #222;
  1530. }
  1531.  
  1532. .metro-pro-blue .entry-meta a {
  1533.     color: #999;
  1534. }
  1535.  
  1536. .metro-pro-blue .archive-pagination li a:hover,
  1537. .metro-pro-blue .button,
  1538. .metro-pro-blue .button:hover,
  1539. .metro-pro-blue .entry-comments-link a,
  1540. .metro-pro-blue .entry-comments-link a:hover,
  1541. .metro-pro-blue .genesis-nav-menu a,
  1542. .metro-pro-blue .site-footer a,
  1543. .metro-pro-blue .site-title a,
  1544. .metro-pro-blue .site-title a:hover,
  1545. .metro-pro-blue a.social-buttons {
  1546.     color: #fff;
  1547. }
  1548.  
  1549. .metro-pro-blue h2 a,
  1550. .metro-pro-blue h2 a:visited {
  1551.     color: #333;
  1552. }
  1553.  
  1554. .metro-pro-blue .archive-pagination li a:hover,
  1555. .metro-pro-blue .archive-pagination li.active a,
  1556. .metro-pro-blue .button:hover,
  1557. .metro-pro-blue .btn:hover,
  1558. .metro-pro-blue .content .entry-comments-link a,
  1559. .metro-pro-blue .enews-widget input:hover[type="submit"],
  1560. .metro-pro-blue .genesis-nav-menu .current-menu-item > a,
  1561. .metro-pro-blue .genesis-nav-menu a:hover,
  1562. .metro-pro-blue .sidebar .enews-widget input[type="submit"],
  1563. .metro-pro-blue .site-title a,
  1564. .metro-pro-blue a.social-buttons:hover,
  1565. .metro-pro-blue button:hover,
  1566. .metro-pro-blue input:hover[type="button"],
  1567. .metro-pro-blue input:hover[type="reset"],
  1568. .metro-pro-blue input:hover[type="submit"] {
  1569.     background-color: #5bb1f9;
  1570. }
  1571.  
  1572. .metro-pro-blue .entry-comments-link a:hover {
  1573.     background-color: #333;
  1574. }
  1575.  
  1576. .metro-pro-blue .sidebar .enews-widget input:hover[type="submit"] {
  1577.     background-color: #fff;
  1578. }
  1579.  
  1580. .metro-pro-blue .genesis-nav-menu > .right > a,
  1581. .metro-pro-blue.header-image .site-title a {
  1582.     background: none;
  1583. }
  1584.  
  1585. /* Metro Pro Green
  1586. --------------------------------------------- */
  1587.  
  1588. .metro-pro-green .entry-title a:hover,
  1589. .metro-pro-green .genesis-nav-menu > .right > a:hover,
  1590. .metro-pro-green .site-footer a:hover,
  1591. .metro-pro-green a,
  1592. .metro-pro-green h2 a:hover {
  1593.     color: #21c250;
  1594. }
  1595.  
  1596. .metro-pro-green .entry-title a,
  1597. .metro-pro-green .entry-meta a:hover,
  1598. .metro-pro-green a:hover {
  1599.     color: #222;
  1600. }
  1601.  
  1602. .metro-pro-green .entry-meta a {
  1603.     color: #999;
  1604. }
  1605.  
  1606. .metro-pro-green .archive-pagination li a:hover,
  1607. .metro-pro-green .button,
  1608. .metro-pro-green .button:hover,
  1609. .metro-pro-green .content .entry-comments-link a {
  1610.      background-color: #20be58;
  1611. }
  1612. .metro-pro-green .entry-comments-link a:hover,
  1613. .metro-pro-green .genesis-nav-menu a,
  1614. .metro-pro-green .site-footer a,
  1615. .metro-pro-green .site-title a,
  1616. .metro-pro-green .site-title a:hover,
  1617. .metro-pro-green a.social-buttons {
  1618.     color: #fff;
  1619. }
  1620.  
  1621. .metro-pro-green h2 a,
  1622. .metro-pro-green h2 a:visited {
  1623.     color: #333;
  1624. }
  1625.  
  1626. .metro-pro-green .archive-pagination li a:hover,
  1627. .metro-pro-green .archive-pagination li.active a,
  1628. .metro-pro-green .button:hover,
  1629. .metro-pro-green .btn:hover,
  1630. .metro-pro-green .content .entry-comments-link a,
  1631. .metro-pro-green .enews-widget input:hover[type="submit"],
  1632. .metro-pro-green .genesis-nav-menu .current-menu-item > a,
  1633. .metro-pro-green .genesis-nav-menu a:hover,
  1634. .metro-pro-green .sidebar .enews-widget input[type="submit"],
  1635. .metro-pro-green .site-title a,
  1636. .metro-pro-green a.social-buttons:hover,
  1637. .metro-pro-green button:hover,
  1638. .metro-pro-green input:hover[type="button"],
  1639. .metro-pro-green input:hover[type="reset"],
  1640. .metro-pro-green input:hover[type="submit"] {
  1641.     background-color: #000000;
  1642. }
  1643.  
  1644. .metro-pro-green .entry-comments-link a:hover {
  1645.     background-color: #21c250;
  1646. }
  1647.  
  1648. .metro-pro-green .sidebar .enews-widget input:hover[type="submit"] {
  1649.     background-color: #fff;
  1650. }
  1651.  
  1652. .metro-pro-green .genesis-nav-menu > .right > a,
  1653. .metro-pro-green.header-image .site-title a {
  1654.     background: none;
  1655. }
  1656.  
  1657. /* Metro Pro Pink
  1658. --------------------------------------------- */
  1659.  
  1660. .metro-pro-pink .entry-title a:hover,
  1661. .metro-pro-pink .genesis-nav-menu > .right > a:hover,
  1662. .metro-pro-pink .site-footer a:hover,
  1663. .metro-pro-pink a,
  1664. .metro-pro-pink h2 a:hover {
  1665.     color: #d1548e;
  1666. }
  1667.  
  1668. .metro-pro-pink .entry-title a,
  1669. .metro-pro-pink .entry-meta a:hover,
  1670. .metro-pro-pink a:hover {
  1671.     color: #222;
  1672. }
  1673.  
  1674. .metro-pro-pink .entry-meta a {
  1675.     color: #999;
  1676. }
  1677.  
  1678. .metro-pro-pink .archive-pagination li a:hover,
  1679. .metro-pro-pink .button,
  1680. .metro-pro-pink .button:hover,
  1681. .metro-pro-pink .entry-comments-link a,
  1682. .metro-pro-pink .entry-comments-link a:hover,
  1683. .metro-pro-pink .genesis-nav-menu a,
  1684. .metro-pro-pink .site-footer a,
  1685. .metro-pro-pink .site-title a,
  1686. .metro-pro-pink .site-title a:hover,
  1687. .metro-pro-pink a.social-buttons {
  1688.     color: #fff;
  1689. }
  1690.  
  1691. .metro-pro-pink h2 a,
  1692. .metro-pro-pink h2 a:visited {
  1693.     color: #333;
  1694. }
  1695.  
  1696. .metro-pro-pink .archive-pagination li a:hover,
  1697. .metro-pro-pink .archive-pagination li.active a,
  1698. .metro-pro-pink .button:hover,
  1699. .metro-pro-pink .btn:hover,
  1700. .metro-pro-pink .content .entry-comments-link a,
  1701. .metro-pro-pink .enews-widget input:hover[type="submit"],
  1702. .metro-pro-pink .genesis-nav-menu .current-menu-item > a,
  1703. .metro-pro-pink .genesis-nav-menu a:hover,
  1704. .metro-pro-pink .sidebar .enews-widget input[type="submit"],
  1705. .metro-pro-pink .site-title a,
  1706. .metro-pro-pink a.social-buttons:hover,
  1707. .metro-pro-pink button:hover,
  1708. .metro-pro-pink input:hover[type="button"],
  1709. .metro-pro-pink input:hover[type="reset"],
  1710. .metro-pro-pink input:hover[type="submit"] {
  1711.     background-color: #d1548e;
  1712. }
  1713.  
  1714. .metro-pro-pink .entry-comments-link a:hover {
  1715.     background-color: #333;
  1716. }
  1717.  
  1718. .metro-pro-pink .sidebar .enews-widget input:hover[type="submit"] {
  1719.     background-color: #fff;
  1720. }
  1721.  
  1722. .metro-pro-pink .genesis-nav-menu > .right > a,
  1723. .metro-pro-pink.header-image .site-title a {
  1724.     background: none;
  1725. }
  1726.  
  1727. /* Metro Pro Red
  1728. --------------------------------------------- */
  1729.  
  1730. .metro-pro-red .entry-title a:hover,
  1731. .metro-pro-red .genesis-nav-menu > .right > a:hover,
  1732. .metro-pro-red .site-footer a:hover,
  1733. .metro-pro-red a,
  1734. .metro-pro-red h2 a:hover {
  1735.     color: #ef4f4f;
  1736. }
  1737.  
  1738. .metro-pro-red .entry-title a,
  1739. .metro-pro-red .entry-meta a:hover,
  1740. .metro-pro-red a:hover {
  1741.     color: #222;
  1742. }
  1743.  
  1744. .metro-pro-red .entry-meta a {
  1745.     color: #999;
  1746. }
  1747.  
  1748. .metro-pro-red .archive-pagination li a:hover,
  1749. .metro-pro-red .button,
  1750. .metro-pro-red .button:hover,
  1751. .metro-pro-red .entry-comments-link a,
  1752. .metro-pro-red .entry-comments-link a:hover,
  1753. .metro-pro-red .genesis-nav-menu a,
  1754. .metro-pro-red .site-footer a,
  1755. .metro-pro-red .site-title a,
  1756. .metro-pro-red .site-title a:hover,
  1757. .metro-pro-red a.social-buttons {
  1758.     color: #fff;
  1759. }
  1760.  
  1761. .metro-pro-red h2 a,
  1762. .metro-pro-red h2 a:visited {
  1763.     color: #333;
  1764. }
  1765.  
  1766. .metro-pro-red .archive-pagination li a:hover,
  1767. .metro-pro-red .archive-pagination li.active a,
  1768. .metro-pro-red .button:hover,
  1769. .metro-pro-red .btn:hover,
  1770. .metro-pro-red .content .entry-comments-link a,
  1771. .metro-pro-red .enews-widget input:hover[type="submit"],
  1772. .metro-pro-red .genesis-nav-menu .current-menu-item > a,
  1773. .metro-pro-red .genesis-nav-menu a:hover,
  1774. .metro-pro-red .sidebar .enews-widget input[type="submit"],
  1775. .metro-pro-red .site-title a,
  1776. .metro-pro-red a.social-buttons:hover,
  1777. .metro-pro-red button:hover,
  1778. .metro-pro-red input:hover[type="button"],
  1779. .metro-pro-red input:hover[type="reset"],
  1780. .metro-pro-red input:hover[type="submit"] {
  1781.     background-color: #ef4f4f;
  1782. }
  1783.  
  1784. .metro-pro-red .entry-comments-link a:hover {
  1785.     background-color: #333;
  1786. }
  1787.  
  1788. .metro-pro-red .sidebar .enews-widget input:hover[type="submit"] {
  1789.     background-color: #fff;
  1790. }
  1791.  
  1792. .metro-pro-red .genesis-nav-menu > .right > a,
  1793. .metro-pro-red.header-image .site-title a {
  1794.     background: none;
  1795. }
  1796.  
  1797.  
  1798. /*
  1799. Media Queries
  1800. ---------------------------------------------------------------------------------------------------- */
  1801.  
  1802. @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
  1803.     only screen and (-moz-min-device-pixel-ratio: 1.5),
  1804.     only screen and (-o-min-device-pixel-ratio: 3/2),
  1805.     only screen and (min-device-pixel-ratio: 1.5) {
  1806.  
  1807.     .after-entry,
  1808.     .comment-respond h3:after,
  1809.     .comment-respond h3:before,
  1810.     .entry-comments h3:after,
  1811.     .entry-comments h3:before,
  1812.     .entry,
  1813.     .widget-title:after,
  1814.     .widget-title:before {
  1815.         background-image: url(images/lines@2x.png);
  1816.     }
  1817.  
  1818.     .search-form input[type="search"] {
  1819.         background-image: url(images/search@2x.png);
  1820.     }
  1821.  
  1822. }
  1823.  
  1824. @media only screen and (max-width: 1139px) {
  1825.  
  1826.     .footer-widgets,
  1827.     .site-container,
  1828.     .wrap {
  1829.         max-width: 960px;
  1830.     }
  1831.  
  1832.     .content-sidebar-sidebar .content-sidebar-wrap,
  1833.     .sidebar-content-sidebar .content-sidebar-wrap,
  1834.     .sidebar-sidebar-content .content-sidebar-wrap {
  1835.         width: 688px;
  1836.     }
  1837.  
  1838.     .content {
  1839.         width: 580px;
  1840.     }
  1841.  
  1842.     .site-header .widget-area {
  1843.         width: 544px;
  1844.     }
  1845.  
  1846.     .content-sidebar-sidebar .content,
  1847.     .sidebar-content-sidebar .content,
  1848.     .sidebar-sidebar-content .content {
  1849.         width: 380px;
  1850.     }
  1851.  
  1852.     .footer-widgets-1,
  1853.     .footer-widgets-2,
  1854.     .footer-widgets-3,
  1855.     .home-middle-left,
  1856.     .home-middle-right,
  1857.     .sidebar-primary,
  1858.     .title-area {
  1859.         width: 272px;
  1860.     }
  1861.  
  1862. }
  1863.  
  1864. @media only screen and (max-width: 1023px) {
  1865.  
  1866.     .footer-widgets,
  1867.     .site-container,
  1868.     .wrap {
  1869.         max-width: 772px;
  1870.     }
  1871.  
  1872.     .content-sidebar-sidebar .content-sidebar-wrap,
  1873.     .content-sidebar-sidebar .content,
  1874.     .content,
  1875.     .footer-widgets-1,
  1876.     .footer-widgets-2,
  1877.     .footer-widgets-3,
  1878.     .sidebar-content-sidebar .content-sidebar-wrap,
  1879.     .sidebar-content-sidebar .content,
  1880.     .sidebar-primary,
  1881.     .sidebar-secondary,
  1882.     .sidebar-sidebar-content .content-sidebar-wrap,
  1883.     .sidebar-sidebar-content .content,
  1884.     .site-header .widget-area,
  1885.     .title-area {
  1886.         width: 100%;
  1887.     }
  1888.  
  1889.     .header-image .site-title a {
  1890.         float: none;
  1891.         margin: 0 auto;
  1892.     }
  1893.  
  1894.     .entry-footer .entry-meta,
  1895.     .sidebar .widget,
  1896.     .site-header,
  1897.     .entry-comments,
  1898.     .comment-respond {
  1899.         padding: 0;
  1900.     }
  1901.  
  1902.     .genesis-nav-menu li,
  1903.     .site-header ul.genesis-nav-menu,
  1904.     .site-header .search-form {
  1905.         float: none;
  1906.     }
  1907.  
  1908.     .genesis-nav-menu,
  1909.     .site-description,
  1910.     .site-footer p,
  1911.     .site-header hgroup,
  1912.     .site-header .search-form,
  1913.     .site-title {
  1914.         text-align: center;
  1915.     }
  1916.  
  1917.     .genesis-nav-menu a {
  1918.         padding: 16px;
  1919.     }
  1920.  
  1921.     .site-header .search-form {
  1922.         margin: 16px auto ;
  1923.         width: 100%;
  1924.     }
  1925.  
  1926.     .genesis-nav-menu li.alignleft,
  1927.     .genesis-nav-menu li.right {
  1928.         display: none;
  1929.     }
  1930.  
  1931.     .entry-footer .entry-meta {
  1932.         margin: 0;
  1933.         padding-top: 12px;
  1934.     }
  1935.  
  1936.     .home-middle-left,
  1937.     .home-middle-right {
  1938.         width: 332px;
  1939.     }
  1940.  
  1941.     .sidebar .widget.enews-widget {
  1942.         padding: 40px;
  1943.     }
  1944.  
  1945.     .footer-widgets-1 {
  1946.         margin: 0;
  1947.     }
  1948.  
  1949.     .site-footer {
  1950.         padding: 24px;
  1951.     }
  1952.  
  1953. }
  1954.  
  1955. @media only screen and (max-width: 767px) {
  1956.  
  1957.     body {
  1958.         font-size: 14px;
  1959.     }
  1960.  
  1961.     .footer-widgets,
  1962.     .site-container {
  1963.         width: 94%;
  1964.     }
  1965.  
  1966.     .site-container {
  1967.         padding: 20px 5%;
  1968.     }
  1969.  
  1970.     .five-sixths,
  1971.     .four-sixths,
  1972.     .home-middle-left,
  1973.     .home-middle-right,
  1974.     .one-fourth,
  1975.     .one-half,
  1976.     .one-sixth,
  1977.     .one-third,
  1978.     .three-fourths,
  1979.     .three-sixths,
  1980.     .two-fourths,
  1981.     .two-sixths,
  1982.     .two-thirds {
  1983.         margin: 0;
  1984.         width: 100%;
  1985.     }
  1986.  
  1987.     .genesis-nav-menu a,
  1988.     .nav-primary .sub-menu a {
  1989.         font-size: 12px;
  1990.         padding: 12px;
  1991.     }
  1992.  
  1993.     .nav-secondary a,
  1994.     .nav-secondary .sub-menu a {
  1995.         font-size: 11px;
  1996.         padding: 10px 8px;
  1997.     }
  1998.  
  1999.     .genesis-nav-menu .sub-menu .sub-menu {
  2000.         margin: -31px 0 0 174px;
  2001.     }
  2002.  
  2003.     .nav-primary .sub-menu .sub-menu {
  2004.         margin: -36px 0 0 174px;
  2005.     }
  2006.  
  2007.     .entry-title {
  2008.         font-size: 30px;
  2009.     }
  2010.  
  2011.     .after-entry .enews-widget input,
  2012.     .after-entry .enews-widget input[type="submit"] {
  2013.         width: 100%;
  2014.         margin-bottom: 10px;
  2015.     }
  2016.  
  2017.     .footer-widgets {
  2018.         padding: 20px 5% 0;
  2019.     }
  2020.  
  2021. }
  2022.  
  2023. @media only screen and (max-width: 480px) {
  2024.  
  2025.     .content .entry-meta .entry-comments-link {
  2026.         display: block;
  2027.         float: none;
  2028.         margin: 10px 0;
  2029.     }
  2030.  
  2031. }
  2032.  
  2033. @media only screen and (max-width: 320px) {
  2034.  
  2035.     .header-image .site-title a {
  2036.         background-size: contain !important;
  2037.     }
  2038.  
  2039.     .site-title {
  2040.         font-size: 36px;
  2041.     }
  2042.  
  2043. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement