Advertisement
Guest User

Genesis Sample Theme With Different Header Images

a guest
Aug 18th, 2013
99
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 27.92 KB | None | 0 0
  1. /*
  2.     Theme Name: Custom Sample Theme
  3.     Description: This is a custom sample theme created for the Genesis Framework.
  4.     Author: Brad Dalton - WP sites
  5.     Author URI: http://wpsites.net
  6.     Version: 2.0
  7.  
  8.     Tags: black, orange, white, one-column, two-columns, three-columns, fixed-width, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
  9.  
  10.     Template: genesis
  11.     Template Version: 2.0.0
  12.  
  13.     License: GPL-2.0+
  14.     License URI: http://www.opensource.org/licenses/gpl-license.php
  15. */
  16.  
  17.  
  18. /* Table of Contents
  19.  
  20.     - Imports
  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.         - Headings
  39.     - Widgets
  40.         - Featured Content
  41.     - Plugins
  42.         - Genesis eNews Extended
  43.         - Genesis Latest Tweets
  44.         - Jetpack
  45.         - Gravity Forms
  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.         - Entries
  55.         - Navigation
  56.         - Comments
  57.     - Sidebars
  58.     - Footer Widgets
  59.     - Site Footer
  60.     - Media Queries
  61.         - max-width: 1139px
  62.         - max-width: 1023px
  63.         - max-width: 767px
  64.  
  65. */
  66.  
  67.  
  68. /*
  69. HTML5 Reset
  70. ---------------------------------------------------------------------------------------------------- */
  71.  
  72. /* Baseline Normalize
  73.     normalize.css v2.1.2 | MIT License | git.io/normalize
  74. --------------------------------------------- */
  75.  
  76. 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}
  77.  
  78. /* Box Sizing
  79. --------------------------------------------- */
  80.  
  81. *,
  82. input[type="search"] {
  83.     -webkit-box-sizing: border-box;
  84.     -moz-box-sizing:    border-box;
  85.     box-sizing:         border-box;
  86. }
  87.  
  88. /* Float Clearing
  89. --------------------------------------------- */
  90.  
  91. .archive-navigation:before,
  92. .clearfix:before,
  93. .entry:before,
  94. .entry-navigation:before,
  95. .footer-widgets:before,
  96. .nav-primary:before,
  97. .nav-secondary:before,
  98. .site-container:before,
  99. .site-footer:before,
  100. .site-header:before,
  101. .site-inner:before,
  102. .wrap:before {
  103.     content: " ";
  104.     display: table;
  105. }
  106.  
  107. .archive-navigation:after,
  108. .clearfix:after,
  109. .entry:after,
  110. .entry-navigation:after,
  111. .footer-widgets:after,
  112. .nav-primary:after,
  113. .nav-secondary:after,
  114. .site-container:after,
  115. .site-footer:after,
  116. .site-header:after,
  117. .site-inner:after,
  118. .wrap:after {
  119.     clear: both;
  120.     content: " ";
  121.     display: table;
  122. }
  123.  
  124. /*
  125. Defaults
  126. ---------------------------------------------------------------------------------------------------- */
  127.  
  128. /* Typographical Elements
  129. --------------------------------------------- */
  130.  
  131. html {
  132.     font-size: 62.5%; /* 10px browser default */
  133. }
  134.  
  135. body {
  136.     background-color: #f5f5f5;
  137.     color: #666;
  138.     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  139.     font-size: 16px;
  140.     font-size: 1.6rem;
  141.     font-weight: 300;
  142.     line-height: 1.625;
  143. }
  144.  
  145. a,
  146. button,
  147. a.cta-button,
  148. input:focus,
  149. input[type="button"],
  150. input[type="reset"],
  151. input[type="submit"],
  152. textarea:focus,
  153. .button {
  154.     -webkit-transition: all 0.1s ease-in-out;
  155.     -moz-transition:    all 0.1s ease-in-out;
  156.     -ms-transition:     all 0.1s ease-in-out;
  157.     -o-transition:      all 0.1s ease-in-out;
  158.     transition:         all 0.1s ease-in-out;
  159. }
  160.  
  161. ::-moz-selection {
  162.     background-color: #333;
  163.     color: #fff;
  164. }
  165.  
  166. ::selection {
  167.     background-color: #333;
  168.     color: #fff;
  169. }
  170.  
  171. a {
  172.     color: #666;
  173.     text-decoration: none;
  174. }
  175.  
  176. a img {
  177.     margin-bottom: -4px;
  178.     margin-bottom: -0.4rem;
  179. }
  180.  
  181. a:hover {
  182.     color: #333;
  183. }
  184.  
  185. p {
  186.     margin: 0 0 24px;
  187.     margin: 0 0 2.4rem;
  188.     padding: 0;
  189. }
  190.  
  191. strong {
  192.     font-weight: 700;
  193. }
  194.  
  195. ol,
  196. ul {
  197.     margin: 0;
  198.     padding: 0;
  199. }
  200.  
  201. blockquote,
  202. blockquote::before {
  203.     color: #999;
  204. }
  205.  
  206. blockquote {
  207.     margin: 40px 40px 24px;
  208.     margin: 4rem 4rem 2.4rem;
  209. }
  210.  
  211. blockquote::before {
  212.     content: "\201C";
  213.     display: block;
  214.     font-size: 30px;
  215.     font-size: 3rem;
  216.     height: 0;
  217.     left: -20px;
  218.     position: relative;
  219.     top: -10px;
  220. }
  221.  
  222. .entry-content code {
  223.     background-color: #333;
  224.     color: #ddd;
  225. }
  226.  
  227. cite {
  228.     font-style: normal;
  229. }
  230.  
  231. /* Headings
  232. --------------------------------------------- */
  233.  
  234. h1,
  235. h2,
  236. h3,
  237. h4,
  238. h5,
  239. h6 {
  240.     color: #333;
  241.     font-family: Lato, sans-serif;
  242.     font-weight: 700;
  243.     line-height: 1.2;
  244.     margin: 0 0 16px;
  245.     margin: 0 0 1.6rem;
  246. }
  247.  
  248. h1 {
  249.     font-size: 26px;
  250.     font-size: 2.6rem;
  251. }
  252.  
  253. h2 {
  254.     font-size: 20px;
  255.     font-size: 2rem;
  256. }
  257.  
  258. h3 {
  259.     font-size: 20px;
  260.     font-size: 2rem;
  261. }
  262.  
  263. h4 {
  264.     font-size: 20px;
  265.     font-size: 2rem;
  266. }
  267.  
  268. h5 {
  269.     font-size: 18px;
  270.     font-size: 1.8rem;
  271. }
  272.  
  273. h6 {
  274.     font-size: 16px;
  275.     font-size: 1.6rem;
  276. }
  277.  
  278. /* Objects
  279. --------------------------------------------- */
  280.  
  281. embed,
  282. iframe,
  283. img,
  284. object,
  285. video,
  286. .wp-caption {
  287.     max-width: 100%;
  288. }
  289.  
  290. img {
  291.     height: auto;
  292.     width: auto; /* IE8 */
  293. }
  294.  
  295. /* Forms
  296. --------------------------------------------- */
  297.  
  298. input,
  299. select,
  300. textarea {
  301.     background-color: #fff;
  302.     border: 1px solid #ddd;
  303.     border-radius: 3px;
  304.     box-shadow: 1px 1px 3px #eee inset;
  305.     color: #999;
  306.     font-size: 14px;
  307.     font-size: 1.4rem;
  308.     padding: 16px;
  309.     padding: 1.6rem;
  310.     width: 100%;
  311. }
  312.  
  313. input:focus,
  314. textarea:focus {
  315.     border: 1px solid #999;
  316.     outline: none;
  317. }
  318.  
  319. ::-moz-placeholder {
  320.     color: #999;
  321.     opacity: 1;
  322. }
  323.  
  324. ::-webkit-input-placeholder {
  325.     color: #999;
  326. }
  327.  
  328. button,
  329. input[type="button"],
  330. input[type="reset"],
  331. input[type="submit"],
  332. .button,
  333. a.cta-button,
  334. .entry-content .button {
  335.     background-color: #333;
  336.     border: none;
  337.     box-shadow: none;
  338.     color: #fff;
  339.     cursor: pointer;
  340.     padding: 16px 24px;
  341.     padding: 1.6rem 2.4rem;
  342.     text-transform: uppercase;
  343.     width: auto;
  344. }
  345.  
  346. button:hover,
  347. input:hover[type="button"],
  348. input:hover[type="reset"],
  349. input:hover[type="submit"],
  350. .button:hover,
  351. a.cta-button,
  352. .entry-content .button:hover {
  353.     background-color: #f15123;
  354. }
  355.  
  356. .entry-content .button:hover {
  357.     color: #fff;
  358. }
  359.  
  360. .button {
  361.     border-radius: 3px;
  362.     display: inline-block;
  363. }
  364.  
  365. input[type="search"]::-webkit-search-cancel-button,
  366. input[type="search"]::-webkit-search-results-button {
  367.     display: none;
  368. }
  369.  
  370. /* Tables
  371. --------------------------------------------- */
  372.  
  373. table {
  374.     border-collapse: collapse;
  375.     border-spacing: 0;
  376.     line-height: 2;
  377.     margin-bottom: 40px;
  378.     margin-bottom: 4rem;
  379.     width: 100%;
  380. }
  381.  
  382. tbody {
  383.     border-bottom: 1px solid #ddd;
  384. }
  385.  
  386. th,
  387. td {
  388.     text-align: left;
  389. }
  390.  
  391. th {
  392.     font-weight: bold;
  393.     text-transform: uppercase;
  394. }
  395.  
  396. td {
  397.     border-top: 1px solid #ddd;
  398.     padding: 6px 0;
  399.     padding: 0.6rem 0;
  400. }
  401.  
  402.  
  403. /*
  404. Structure and Layout
  405. ---------------------------------------------------------------------------------------------------- */
  406.  
  407. /* Site Containers
  408. --------------------------------------------- */
  409.  
  410. .site-inner,
  411. .wrap {
  412.     margin: 0 auto;
  413.     max-width: 1140px;
  414. }
  415.  
  416. .site-inner {
  417.     clear: both;
  418.     padding-top: 40px;
  419.     padding-top: 4rem;
  420. }
  421.  
  422. /* Column Widths and Positions
  423. --------------------------------------------- */
  424.  
  425. /* Wrapping div for .content and .sidebar-primary */
  426.  
  427. .content-sidebar-sidebar .content-sidebar-wrap,
  428. .sidebar-content-sidebar .content-sidebar-wrap,
  429. .sidebar-sidebar-content .content-sidebar-wrap {
  430.     width: 920px;
  431. }
  432.  
  433. .content-sidebar-sidebar .content-sidebar-wrap {
  434.     float: left;
  435. }
  436.  
  437. .sidebar-content-sidebar .content-sidebar-wrap,
  438. .sidebar-sidebar-content .content-sidebar-wrap {
  439.     float: right;
  440. }
  441.  
  442. /* Content */
  443.  
  444. .content {
  445.     float: right;
  446.     width: 740px;
  447. }
  448.  
  449. .content-sidebar .content,
  450. .content-sidebar-sidebar .content,
  451. .sidebar-content-sidebar .content {
  452.     float: left;
  453. }
  454.  
  455. .content-sidebar-sidebar .content,
  456. .sidebar-content-sidebar .content,
  457. .sidebar-sidebar-content .content {
  458.     width: 520px;
  459. }
  460.  
  461. .full-width-content .content {
  462.     width: 100%;
  463. }
  464.  
  465. /* Primary Sidebar */
  466.  
  467. .sidebar-primary {
  468.     float: right;
  469.     width: 360px;
  470. }
  471.  
  472. .sidebar-content .sidebar-primary,
  473. .sidebar-sidebar-content .sidebar-primary {
  474.     float: left;
  475. }
  476.  
  477. /* Secondary Sidebar */
  478.  
  479. .sidebar-secondary {
  480.     float: left;
  481.     width: 180px;
  482. }
  483.  
  484. .content-sidebar-sidebar .sidebar-secondary {
  485.     float: right;
  486. }
  487.  
  488. /* Column Classes
  489.     Link: http://twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css
  490. --------------------------------------------- */
  491.  
  492. .five-sixths,
  493. .four-sixths,
  494. .one-fourth,
  495. .one-half,
  496. .one-sixth,
  497. .one-third,
  498. .three-fourths,
  499. .three-sixths,
  500. .two-fourths,
  501. .two-sixths,
  502. .two-thirds {
  503.     float: left;
  504.     margin-left: 2.564102564102564%;
  505. }
  506.  
  507. .one-half,
  508. .three-sixths,
  509. .two-fourths {
  510.     width: 48.717948717948715%;
  511. }
  512.  
  513. .one-third,
  514. .two-sixths {
  515.     width: 31.623931623931625%;
  516. }
  517.  
  518. .four-sixths,
  519. .two-thirds {
  520.     width: 65.81196581196582%;
  521. }
  522.  
  523. .one-fourth {
  524.     width: 23.076923076923077%;
  525. }
  526.  
  527. .three-fourths {
  528.     width: 74.35897435897436%;
  529. }
  530.  
  531. .one-sixth {
  532.     width: 14.52991452991453%;
  533. }
  534.  
  535. .five-sixths {
  536.     width: 82.90598290598291%;
  537. }
  538.  
  539. .first {
  540.     clear: both;
  541.     margin-left: 0;
  542. }
  543.  
  544.  
  545. /*
  546. Common Classes
  547. ---------------------------------------------------------------------------------------------------- */
  548.  
  549. /* WordPress
  550. --------------------------------------------- */
  551.  
  552. .avatar {
  553.     float: left;
  554. }
  555.  
  556. .alignleft .avatar {
  557.     margin-right: 24px;
  558.     margin-right: 2.4rem;
  559. }
  560.  
  561. .alignright .avatar {
  562.     margin-left: 24px;
  563.     margin-left: 2.4rem;
  564. }
  565.  
  566. .search-form input[type="submit"] {
  567.     border: 0;
  568.     clip: rect(0, 0, 0, 0);
  569.     height: 1px;
  570.     margin: -1px;
  571.     padding: 0;
  572.     position: absolute;
  573.     width: 1px;
  574. }
  575.  
  576. .sticky {
  577. }
  578.  
  579. img.centered,
  580. .aligncenter {
  581.     display: block;
  582.     margin: 0 auto 24px;
  583.     margin: 0 auto 2.4rem
  584. }
  585.  
  586. img.alignnone {
  587.     margin-bottom: 12px;
  588.     margin-bottom: 1.2rem;
  589. }
  590.  
  591. .alignleft {
  592.     float: left;
  593.     text-align: left;
  594. }
  595.  
  596. .alignright {
  597.     float: right;
  598.     text-align: right;
  599. }
  600.  
  601. img.alignleft,
  602. .wp-caption.alignleft {
  603.     margin: 0 24px 24px 0;
  604.     margin: 0 2.4rem 2.4rem 0;
  605. }
  606.  
  607. img.alignright,
  608. .wp-caption.alignright {
  609.     margin: 0 0 24px 24px;
  610.     margin: 0 0 2.4rem 2.4rem;
  611. }
  612.  
  613. .wp-caption-text {
  614.     font-size: 14px;
  615.     font-size: 1.4rem;
  616.     font-weight: 700;
  617.     text-align: center;
  618. }
  619.  
  620. .gallery-caption {
  621. }
  622.  
  623. .widget_calendar table {
  624.     width: 100%;
  625. }
  626.  
  627. .widget_calendar td,
  628. .widget_calendar th {
  629.     text-align: center;
  630. }
  631.  
  632. /* Genesis
  633. --------------------------------------------- */
  634.  
  635. .breadcrumb {
  636.     margin-bottom: 20px;
  637.     margin-bottom: 2rem;
  638. }
  639.  
  640. .archive-description,
  641. .author-box {
  642.     background-color: #fff;
  643.     margin-bottom: 40px;
  644.     margin-bottom: 4rem;
  645. }
  646.  
  647. .archive-description {
  648.     padding: 40px 40px 24px;
  649.     padding: 4rem 4rem 2.4rem;
  650. }
  651.  
  652. .author-box {
  653.     padding: 40px;
  654.     padding: 4rem;
  655. }
  656.  
  657. .author-box-title {
  658.     color: #333;
  659.     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  660.     font-size: 16px;
  661.     font-size: 1.6rem;
  662.     margin-bottom: 4px;
  663.     margin-bottom: 0.4rem;
  664. }
  665.  
  666. .author-box a {
  667.     border-bottom: 1px solid #ddd;
  668. }
  669.  
  670. .author-box p {
  671.     margin-bottom: 0;
  672. }
  673.  
  674. .author-box .avatar {
  675.     margin-right: 24px;
  676.     margin-right: 2.4rem;
  677. }
  678.  
  679. /* Headings
  680. --------------------------------------------- */
  681.  
  682. .entry-title {
  683.     font-size: 26px;
  684.     font-size: 2.6rem;
  685.     line-height: 1;
  686. }
  687.  
  688. .entry-title a,
  689. .sidebar .widget-title a {
  690.     color: #333;
  691. }
  692.  
  693. .entry-title a:hover {
  694.     color: #666;
  695. }
  696.  
  697. .widget-title {
  698.     font-size: 16px;
  699.     font-size: 1.6rem;
  700.     margin-bottom: 24px;
  701.     margin-bottom: 2.4rem;
  702.     text-transform: uppercase;
  703. }
  704.  
  705. .sidebar .widget-title a {
  706.     border: none;
  707. }
  708.  
  709. .archive-title {
  710.     font-size: 20px;
  711.     font-size: 2rem;
  712.     margin-bottom: 24px;
  713.     margin-bottom: 2.4rem;
  714. }
  715.  
  716.  
  717. /*
  718. Widgets
  719. ---------------------------------------------------------------------------------------------------- */
  720.  
  721. /* Featured Content
  722. --------------------------------------------- */
  723.  
  724. .featured-content .entry {
  725.     border-bottom: 2px solid #f5f5f5;
  726.     margin-bottom: 20px;
  727.     margin-bottom: 2rem;
  728.     padding: 0 0 24px;
  729.     padding: 0 0 2.4rem;
  730. }
  731.  
  732. .featured-content .entry-title {
  733.     border: none;
  734.     font-size: 24px;
  735.     font-size: 2.4rem;
  736.     line-height: 1.2;
  737. }
  738.  
  739. .featured-content .entry-title a {
  740.     border: none;
  741. }
  742.  
  743.  
  744. /*
  745. Plugins
  746. ---------------------------------------------------------------------------------------------------- */
  747.  
  748. /* Genesis eNews Extended
  749. --------------------------------------------- */
  750.  
  751. .enews-widget {
  752.     color: #999;
  753. }
  754.  
  755. .enews-widget .widget-title {
  756.     color: #fff;
  757. }
  758.  
  759. .enews-widget input {
  760.     margin-bottom: 16px;
  761.     margin-bottom: 1.6rem;
  762. }
  763.  
  764. .enews-widget input:focus {
  765.     border: 1px solid #ddd;
  766. }
  767.  
  768. .enews-widget input[type="submit"] {
  769.     background-color: #f15123;
  770.     color: #fff;
  771.     margin: 0;
  772.     width: 100%;
  773. }
  774.  
  775. .enews-widget input:hover[type="submit"] {
  776.     background-color: #fff;
  777.     color: #333;
  778. }
  779.  
  780. /* Genesis Latest Tweets
  781. --------------------------------------------- */
  782.  
  783. .latest-tweets ul li {
  784.     margin-bottom: 16px;
  785.     margin-bottom: 1.6rem;
  786. }
  787.  
  788. /* Jetpack
  789. --------------------------------------------- */
  790.  
  791. img#wpstats {
  792.     display: none;
  793. }
  794.  
  795. /* Gravity Forms
  796. --------------------------------------------- */
  797.  
  798. div.gform_wrapper input[type="email"],
  799. div.gform_wrapper input[type="text"],
  800. div.gform_wrapper textarea,
  801. div.gform_wrapper .ginput_complex label {
  802.     font-size: 16px;
  803.     font-size: 1.6rem;
  804.     padding: 16px;
  805.     padding: 1.6rem;
  806. }
  807.  
  808. div.gform_wrapper .ginput_complex label {
  809.     padding: 0;
  810. }
  811.  
  812. div.gform_wrapper li,
  813. div.gform_wrapper form li {
  814.     margin: 16px 0 0;
  815.     margin: 1.6rem 0 0;
  816. }
  817.  
  818. div.gform_wrapper .gform_footer input[type="submit"] {
  819.     font-size: 14px;
  820.     font-size: 1.4rem;
  821. }
  822.  
  823.  
  824. /*
  825. Site Header
  826. ---------------------------------------------------------------------------------------------------- */
  827.  
  828. .site-header {
  829.     background-color: #FFFFFF;
  830. }
  831.  
  832. /* Title Area
  833. --------------------------------------------- */
  834.  
  835. .title-area {
  836.     font-family: Lato, sans-serif;
  837.     font-weight: 700;
  838.     float: left;
  839.     padding: 16px 0;
  840.     padding: 1.6rem 0;
  841.     width: 1080px;
  842. }
  843.  
  844. .header-image .title-area {
  845.     padding: 0;
  846. }
  847.  
  848. .site-title {
  849.     font-size: 28px;
  850.     font-size: 2.8rem;
  851.     line-height: 1;
  852.     margin: 0 0 8px;
  853.     margin: 0 0 0.8rem;
  854.     text-transform: uppercase;
  855. }
  856.  
  857. .site-title a,
  858. .site-title a:hover {
  859.     color: #333;
  860. }
  861.  
  862. .site-description {
  863.     color: #999;
  864.     font-size: 16px;
  865.     font-size: 1.6rem;
  866.     font-weight: 300;
  867.     line-height: 1;
  868.     margin-bottom: 0;
  869. }
  870.  
  871. /* Full width header, no widgets */
  872.  
  873. .header-full-width .title-area,
  874. .header-full-width .site-title {
  875.     width: 100%;
  876. }
  877.  
  878. .header-image .site-description,
  879. .header-image .site-title a {
  880.     display: block;
  881.     text-indent: -9999px;
  882. }
  883.  
  884. /* Widget Area
  885. --------------------------------------------- */
  886.  
  887. .site-header .widget-area {
  888.     float: right;
  889.     text-align: right;
  890.     width: 800px;
  891. }
  892.  
  893. .header-image .site-header .widget-area {
  894.     padding: 40px 0;
  895.     padding: 4rem 0;
  896. }
  897.  
  898. .site-header .search-form {
  899.     float: right;
  900.     margin-top: 24px;
  901.     margin-top: 2.4rem;
  902. }
  903.  
  904.  
  905. /*
  906. Site Navigation
  907. ---------------------------------------------------------------------------------------------------- */
  908.  
  909. .genesis-nav-menu {
  910.     clear: both;
  911.     color: #999;
  912.     font-family: Lato, sans-serif;
  913.     line-height: 1.5;
  914.     width: 100%;
  915. }
  916.  
  917. .genesis-nav-menu .menu-item {
  918.     display: inline-block;
  919.     text-align: left;
  920. }
  921.  
  922. .genesis-nav-menu a {
  923.     border: none;
  924.     color: #999;
  925.     display: block;
  926.     padding: 28px 24px;
  927.     padding: 2.8rem 2.4rem;
  928.     position: relative;
  929. }
  930.  
  931. .genesis-nav-menu a:hover,
  932. .genesis-nav-menu .current-menu-item > a,
  933. .genesis-nav-menu .sub-menu .current-menu-item > a:hover {
  934.     color: #333;
  935. }
  936.  
  937. .genesis-nav-menu .sub-menu .current-menu-item > a {
  938.     color: #999;
  939. }
  940.  
  941. .genesis-nav-menu > .menu-item > a {
  942.     text-transform: uppercase;
  943. }
  944.  
  945. .genesis-nav-menu .sub-menu {
  946.     left: -9999px;
  947.     opacity: 0;
  948.     position: absolute;
  949.     -webkit-transition: opacity .4s ease-in-out;
  950.     -moz-transition:    opacity .4s ease-in-out;
  951.     -ms-transition:     opacity .4s ease-in-out;
  952.     -o-transition:      opacity .4s ease-in-out;
  953.     transition:         opacity .4s ease-in-out;
  954.     width: 200px;
  955.     z-index: 99;
  956. }
  957.  
  958. .genesis-nav-menu .sub-menu a {
  959.     background-color: #fff;
  960.     border: 1px solid #eee;
  961.     border-top: none;
  962.     font-size: 14px;
  963.     font-size: 1.4rem;
  964.     padding: 16px 20px;
  965.     padding: 1.6rem 2rem;
  966.     position: relative;
  967.     width: 200px;
  968. }
  969.  
  970. .genesis-nav-menu .sub-menu .sub-menu {
  971.     margin: -54px 0 0 199px;
  972. }
  973.  
  974. .genesis-nav-menu .menu-item:hover {
  975.     position: static;
  976. }
  977.  
  978. .genesis-nav-menu .menu-item:hover > .sub-menu {
  979.     left: auto;
  980.     opacity: 1;
  981. }
  982.  
  983. .genesis-nav-menu > .first > a {
  984.     padding-left: 0;
  985. }
  986.  
  987. .genesis-nav-menu > .last > a {
  988.     padding-right: 0;
  989. }
  990.  
  991. .genesis-nav-menu > .right {
  992.     display: inline-block;
  993.     float: right;
  994.     list-style-type: none;
  995.     padding: 28px 0;
  996.     padding: 2.8rem 0;
  997.     text-transform: uppercase;
  998. }
  999.  
  1000. .genesis-nav-menu > .right > a {
  1001.     display: inline;
  1002.     padding: 0;
  1003. }
  1004.  
  1005. .genesis-nav-menu > .rss > a {
  1006.     margin-left: 48px;
  1007.     margin-left: 4.8rem;
  1008. }
  1009.  
  1010. .genesis-nav-menu > .search {
  1011.     padding: 14px 0 0;
  1012.     padding: 1.4rem 0 0;
  1013. }
  1014.  
  1015. /* Site Header Navigation
  1016. --------------------------------------------- */
  1017.  
  1018. .site-header .sub-menu {
  1019.     border-top: 1px solid #eee;
  1020. }
  1021.  
  1022. .site-header .sub-menu .sub-menu {
  1023.     margin-top: -55px;
  1024. }
  1025.  
  1026. /* Primary Navigation
  1027. --------------------------------------------- */
  1028.  
  1029. .nav-primary {
  1030.     background-color: #333;
  1031. }
  1032.  
  1033. .nav-primary a:hover,
  1034. .nav-primary .current-menu-item > a {
  1035.     color: #fff;
  1036. }
  1037.  
  1038. .nav-primary .sub-menu a:hover {
  1039.     color: #333;
  1040. }
  1041.  
  1042. /* Secondary Navigation
  1043. --------------------------------------------- */
  1044.  
  1045. .nav-secondary {
  1046.     background-color: #fff;
  1047. }
  1048.  
  1049.  
  1050. /*
  1051. Content Area
  1052. ---------------------------------------------------------------------------------------------------- */
  1053.  
  1054. /* Entries
  1055. --------------------------------------------- */
  1056.  
  1057. .entry {
  1058.     background-color: #fff;
  1059.     border-radius: 3px;
  1060.     margin-bottom: 40px;
  1061.     margin-bottom: 4rem;
  1062.     padding: 40px 40px 24px;
  1063.     padding: 4rem 4rem 2.4rem;
  1064. }
  1065.  
  1066. .entry-content a {
  1067.     border-bottom: 1px solid #ddd;
  1068.     color: #f15123;
  1069. }
  1070.  
  1071. .entry-content a:hover {
  1072.     color: #333;
  1073. }
  1074.  
  1075. .entry-content .attachment a,
  1076. .entry-content .gallery a {
  1077.     border: none;
  1078. }
  1079.  
  1080. .entry-content ol,
  1081. .entry-content p,
  1082. .entry-content ul,
  1083. .quote-caption {
  1084.     margin-bottom: 26px;
  1085.     margin-bottom: 2.6rem;
  1086. }
  1087.  
  1088. .entry-content ol,
  1089. .entry-content ul {
  1090.     margin-left: 40px;
  1091.     margin-left: 4rem;
  1092. }
  1093.  
  1094. .entry-content ol li {
  1095.     list-style-type: decimal;
  1096. }
  1097.  
  1098. .entry-content ul li {
  1099.     list-style-type: disc;
  1100. }
  1101.  
  1102. .entry-content ol ol,
  1103. .entry-content ul ul {
  1104.     margin-bottom: 0;
  1105. }
  1106.  
  1107. .entry-content .search-form {
  1108.     width: 50%;
  1109. }
  1110.  
  1111. .entry-meta {
  1112.     clear: both;
  1113.     color: #999;
  1114.     font-size: 14px;
  1115.     font-size: 1.4rem;
  1116. }
  1117.  
  1118. .entry-meta a {
  1119.     border-bottom: 1px solid #ddd;
  1120. }
  1121.  
  1122. .entry-header .entry-meta {
  1123.     margin-bottom: 24px;
  1124.     margin-bottom: 2.4rem;
  1125. }
  1126.  
  1127. .entry-footer .entry-meta {
  1128.     border-top: 2px solid #f5f5f5;
  1129.     margin: 0 -40px;
  1130.     margin: 0 -4rem;
  1131.     padding: 32px 40px 8px;
  1132.     padding: 3.2rem 4rem 0.8rem;
  1133. }
  1134.  
  1135. .entry-comments-link::before {
  1136.     content: "\2014";
  1137.     margin: 0 6px 0 2px;
  1138.     margin: 0 0.6rem 0 0.2rem;
  1139. }
  1140.  
  1141. .entry-categories,
  1142. .entry-tags {
  1143.     display: block;
  1144. }
  1145.  
  1146. /* Navigation
  1147. --------------------------------------------- */
  1148.  
  1149. .archive-navigation,
  1150. .entry-navigation {
  1151.     font-size: 14px;
  1152.     font-size: 1.4rem;
  1153.     margin: 40px 0;
  1154.     margin: 4rem 0;
  1155. }
  1156.  
  1157. .archive-navigation li {
  1158.     display: inline;
  1159. }
  1160.  
  1161. .archive-navigation li a {
  1162.     background-color: #333;
  1163.     border-radius: 3px;
  1164.     color: #fff;
  1165.     cursor: pointer;
  1166.     display: inline-block;
  1167.     padding: 8px 12px;
  1168.     padding: 0.8rem 1.2rem;
  1169. }
  1170.  
  1171. .archive-navigation li a:hover,
  1172. .archive-navigation li.active a {
  1173.     background-color: #f15123;
  1174. }
  1175.  
  1176. .entry-navigation a {
  1177.     border-bottom: 1px solid #ddd;
  1178. }
  1179.  
  1180. /* Comments
  1181. --------------------------------------------- */
  1182.  
  1183. .comment-respond,
  1184. .entry-comments,
  1185. .entry-pings {
  1186.     background-color: #fff;
  1187.     margin-bottom: 40px;
  1188.     margin-bottom: 4rem;
  1189. }
  1190.  
  1191. .entry-comments {
  1192.     padding: 40px;
  1193.     padding: 4rem;
  1194. }
  1195.  
  1196. .comment-respond,
  1197. .entry-pings {
  1198.     padding: 40px 40px 16px;
  1199.     padding: 4rem 4rem 1.6rem;
  1200. }
  1201.  
  1202. .comment-respond a,
  1203. .entry-comments a {
  1204.     border-bottom: 1px solid #ddd;
  1205. }
  1206.  
  1207. .comment-content {
  1208.     clear: both;
  1209. }
  1210.  
  1211. .entry-comments .comment-author {
  1212.     margin-bottom: 0;
  1213. }
  1214.  
  1215. .comment-respond input[type="email"],
  1216. .comment-respond input[type="text"],
  1217. .comment-respond input[type="url"] {
  1218.     width: 50%
  1219. }
  1220.  
  1221. .comment-respond label {
  1222.     display: block;
  1223.     margin-right: 12px;
  1224.     margin-right: 1.2rem;
  1225. }
  1226.  
  1227. .comment-list li,
  1228. .ping-list li {
  1229.     list-style-type: none;
  1230. }
  1231.  
  1232. .comment-list li {
  1233.     margin-top: 24px;
  1234.     margin-top: 2.4rem;
  1235.     padding: 32px;
  1236.     padding: 3.2rem;
  1237. }
  1238.  
  1239. .comment-list li li {
  1240.     margin-right: -32px;
  1241.     margin-right: -3.2rem;
  1242. }
  1243.  
  1244. li.comment {
  1245.     background-color: #f5f5f5;
  1246.     border: 2px solid #fff;
  1247.     border-right: none;
  1248. }
  1249.  
  1250. .comment .avatar {
  1251.     margin: 0 16px 24px 0;
  1252.     margin: 0 1.6rem 2.4rem 0;
  1253. }
  1254.  
  1255. .entry-pings .reply {
  1256.     display: none;
  1257. }
  1258.  
  1259. .bypostauthor {
  1260. }
  1261.  
  1262. .form-allowed-tags {
  1263.     background-color: #f5f5f5;
  1264.     font-size: 14px;
  1265.     font-size: 1.4rem;
  1266.     padding: 24px;
  1267.     padding: 2.4rem;
  1268. }
  1269.  
  1270.  
  1271. /*
  1272. Sidebars
  1273. ---------------------------------------------------------------------------------------------------- */
  1274.  
  1275. .sidebar {
  1276.     color: #999;
  1277. }
  1278.  
  1279. .sidebar a {
  1280.     border-bottom: 1px solid #ddd;
  1281. }
  1282.  
  1283. .sidebar p:last-child {
  1284.     margin-bottom: 0;
  1285. }
  1286.  
  1287. .sidebar li {
  1288.     list-style-type: none;
  1289.     margin-bottom: 6px;
  1290.     margin-bottom: 0.6rem;
  1291.     word-wrap: break-word;
  1292. }
  1293.  
  1294. .sidebar ul > li:last-child {
  1295.     margin-bottom: 0;
  1296. }
  1297.  
  1298. .sidebar .widget {
  1299.     background-color: #fff;
  1300.     border-radius: 3px;
  1301.     margin-bottom: 40px;
  1302.     margin-bottom: 4rem;
  1303.     padding: 40px;
  1304.     padding: 4rem;
  1305. }
  1306.  
  1307. .sidebar .enews-widget {
  1308.     background-color: #333;
  1309. }
  1310.  
  1311.  
  1312. /*
  1313. Footer Widgets
  1314. ---------------------------------------------------------------------------------------------------- */
  1315.  
  1316. .footer-widgets {
  1317.     background-color: #333;
  1318.     color: #999;
  1319.     clear: both;
  1320.     padding: 40px 0 16px;
  1321.     padding: 4rem 0 1.6rem;
  1322. }
  1323.  
  1324. .footer-widgets-1,
  1325. .footer-widgets-3 {
  1326.     width: 350px;
  1327. }
  1328.  
  1329. .footer-widgets-2 {
  1330.     width: 360px;
  1331. }
  1332.  
  1333. .footer-widgets-1 {
  1334.     margin-right: 40px;
  1335.     margin-right: 4rem;
  1336. }
  1337.  
  1338. .footer-widgets-1,
  1339. .footer-widgets-2 {
  1340.     float: left;
  1341. }
  1342.  
  1343. .footer-widgets-3 {
  1344.     float: right;
  1345. }
  1346.  
  1347. .footer-widgets a {
  1348.     border-bottom: 1px solid #666;
  1349.     color: #999;
  1350. }
  1351.  
  1352. .footer-widgets a:hover {
  1353.     color: #ddd;
  1354. }
  1355.  
  1356. .footer-widgets .widget {
  1357.     margin-bottom: 24px;
  1358.     margin-bottom: 2.4rem;
  1359. }
  1360.  
  1361. .footer-widgets .widget-title {
  1362.     color: #fff;
  1363. }
  1364.  
  1365. .footer-widgets li {
  1366.     list-style-type: none;
  1367.     margin-bottom: 6px;
  1368.     margin-bottom: 0.6rem;
  1369.     word-wrap: break-word;
  1370. }
  1371.  
  1372. .footer-widgets .search-form input:focus {
  1373.     border: 1px solid #ddd;
  1374. }
  1375.  
  1376.  
  1377. /*
  1378. Site Footer
  1379. ---------------------------------------------------------------------------------------------------- */
  1380.  
  1381. .site-footer {
  1382.     background-color: #fff;
  1383.     color: #999;
  1384.     font-size: 14px;
  1385.     font-size: 1.4rem;
  1386.     padding: 40px 0;
  1387.     padding: 4rem 0;
  1388.     text-align: center;
  1389. }
  1390.  
  1391. .site-footer a {
  1392.     border-bottom: 1px solid #ddd;
  1393. }
  1394.  
  1395. .site-footer p {
  1396.     margin-bottom: 0;
  1397. }
  1398.  
  1399.  
  1400. /*
  1401. Media Queries
  1402. ---------------------------------------------------------------------------------------------------- */
  1403.  
  1404. @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
  1405.     only screen and (-moz-min-device-pixel-ratio: 1.5),
  1406.     only screen and (-o-min-device-pixel-ratio: 3/2),
  1407.     only screen and (min-device-pixel-ratio: 1.5) {
  1408.  
  1409.     .header-image .site-header .wrap {
  1410.         background: url(images/logo@2x.png) no-repeat ;
  1411.         background-size: 320px 164px;
  1412.     }
  1413.  
  1414. }
  1415.  
  1416. @media only screen and (max-width: 1139px) {
  1417.  
  1418.     .site-inner,
  1419.     .wrap {
  1420.         max-width: 960px;
  1421.     }
  1422.  
  1423.     .content-sidebar-sidebar .content-sidebar-wrap,
  1424.     .sidebar-content-sidebar .content-sidebar-wrap,
  1425.     .sidebar-sidebar-content .content-sidebar-wrap {
  1426.         width: 740px;
  1427.     }
  1428.  
  1429.     .content,
  1430.     .site-header .widget-area {
  1431.         width: 620px;
  1432.     }
  1433.  
  1434.     .sidebar-content-sidebar .content,
  1435.     .sidebar-sidebar-content .content,
  1436.     .content-sidebar-sidebar .content {
  1437.         width: 400px;
  1438.     }
  1439.  
  1440.     .footer-widgets-1,
  1441.     .footer-widgets-2,
  1442.     .footer-widgets-3,
  1443.     .sidebar-primary,
  1444.     .title-area {
  1445.         width: 300px;
  1446.     }
  1447.  
  1448. }
  1449.  
  1450. @media only screen and (max-width: 1023px) {
  1451.  
  1452.     body {
  1453.         background-color: #fff;
  1454.     }
  1455.  
  1456.     .content,
  1457.     .content-sidebar-sidebar .content,
  1458.     .content-sidebar-sidebar .content-sidebar-wrap,
  1459.     .footer-widgets-1,
  1460.     .footer-widgets-2,
  1461.     .footer-widgets-3,
  1462.     .sidebar-content-sidebar .content,
  1463.     .sidebar-content-sidebar .content-sidebar-wrap,
  1464.     .sidebar-primary,
  1465.     .sidebar-secondary,
  1466.     .sidebar-sidebar-content .content,
  1467.     .sidebar-sidebar-content .content-sidebar-wrap,
  1468.     .site-header .widget-area,
  1469.     .site-inner,
  1470.     .title-area,
  1471.     .wrap {
  1472.         width: 100%;
  1473.     }
  1474.  
  1475.     .site-header .wrap {
  1476.         padding: 20px 0;
  1477.         padding: 2rem 0;
  1478.     }
  1479.  
  1480.     .header-image .site-header .wrap {
  1481.         background-position: center top;
  1482.     }
  1483.  
  1484.     .site-inner {
  1485.         padding-left: 5%;
  1486.         padding-right: 5%;
  1487.     }
  1488.  
  1489.     .archive-description,
  1490.     .author-box,
  1491.     .comment-respond,
  1492.     .entry,
  1493.     .entry-comments,
  1494.     .entry-footer .entry-meta,
  1495.     .header-image .site-header .widget-area,
  1496.     .sidebar .widget,
  1497.     .site-header {
  1498.         padding: 0;
  1499.     }
  1500.  
  1501.     .genesis-nav-menu li,
  1502.     .site-header ul.genesis-nav-menu,
  1503.     .site-header .search-form {
  1504.         float: none;
  1505.     }
  1506.  
  1507.     .genesis-nav-menu,
  1508.     .site-description,
  1509.     .site-header .title-area,
  1510.     .site-header .search-form,
  1511.     .site-title {
  1512.         text-align: center;
  1513.     }
  1514.  
  1515.     .genesis-nav-menu a,
  1516.     .genesis-nav-menu > .first > a,
  1517.     .genesis-nav-menu > .last > a {
  1518.         padding: 20px 16px;
  1519.         padding: 2rem 1.6rem;
  1520.     }
  1521.  
  1522.     .site-header .search-form {
  1523.         margin: 16px auto ;
  1524.         margin: 1.6rem auto;
  1525.     }
  1526.  
  1527.     .genesis-nav-menu li.right {
  1528.         display: none;
  1529.     }
  1530.  
  1531.     .entry-footer .entry-meta {
  1532.         margin: 0;
  1533.         padding-top: 12px;
  1534.         padding-top: 1.2rem;
  1535.     }
  1536.  
  1537.     .sidebar .widget.enews-widget {
  1538.         padding: 40px;
  1539.         padding: 4rem;
  1540.     }
  1541.  
  1542.     .site-footer {
  1543.         padding: 24px 0;
  1544.         padding: 2.4rem 0;
  1545.     }
  1546.  
  1547.     .footer-widgets {
  1548.         padding: 40px 5% 16px;
  1549.     }
  1550.  
  1551.     .footer-widgets-1 {
  1552.         margin: 0;
  1553.     }
  1554.  
  1555. }
  1556.  
  1557. @media only screen and (max-width: 767px) {
  1558.  
  1559.     .five-sixths,
  1560.     .four-sixths,
  1561.     .one-fourth,
  1562.     .one-half,
  1563.     .one-sixth,
  1564.     .one-third,
  1565.     .three-fourths,
  1566.     .three-sixths,
  1567.     .two-fourths,
  1568.     .two-sixths,
  1569.     .two-thirds {
  1570.         margin: 0;
  1571.         width: 100%;
  1572.     }
  1573.  
  1574. }
  1575.  
  1576. /*
  1577. Custom Styling
  1578. ---------------------------------------------------------------------------------------------------- */
  1579. .home .site-header {
  1580. background: url("images/home-header.png") no-repeat scroll 0 0 transparent;
  1581. height: 262px;
  1582. width: 1600px;
  1583. overflow: auto;
  1584. margin: auto;
  1585. position: centre;
  1586. }
  1587.  
  1588. .site-header {
  1589. background: url("images/page-header.png") no-repeat scroll 0 0 transparent;
  1590. height: 164px;
  1591. width: 1600x;
  1592. overflow: auto;
  1593. margin: auto;
  1594. position: centre;
  1595. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement