/*
Theme Name: Alpha Lite
Theme URI: https://github.com/DewaneMutunga/alpha-lite
Author: Dewane Mutunga
Author URI: http://dewanemutunga.com
Description: Alpha Lite is a simple theme for WordPress professionals.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: alpha_lite
Domain Path: /languages/
Tags: red, white, two-columns, right-sidebar, responsive-layout, featured-images, flexible-header, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Alpha Lite is based on Underscores http://underscores.me/, (C) 2012-2014 Automattic, Inc.
Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
and Blueprint http://www.blueprintcss.org/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 - Reset
1.1 - Structure
2.0 - Typography
3.0 - Elements
3.1 - Tables
4.0 - Forms
5.0 - Navigation
5.1 - Links
5.2 - Menus
6.0 - Accessibility
7.0 - Alignments
8.0 - Clearings
9.0 - Widgets
10.0 - Content
10.1 - Posts and pages
10.2 - Asides
10.3 - Comments
11.0 - Infinite scroll
12.0 - Media
12.1 - Captions
12.2 - Galleries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
1.0 - Reset
--------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
border: 0;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-ms-word-wrap: break-word;
word-wrap: break-word;
}
body {
background: #fff;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
display: block;
}
ol, ul {
list-style: none;
}
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
font-weight: normal;
text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
a img {
border: 0;
}
/*--------------------------------------------------------------
1.1 - Structure - read the description and the CSS rules
*
* If you're already familiar with Underscores, it's important
* to know that the page-width HTML structure has been replaced
* in this theme by a full-width structure... that way full-width
* designs can be created as well as page-width if you choose to
* do so.
*
* The #page that originally wrapped the header, content, and footer
* has been removed and those three sections have been given their
* own full-width HTML structure like so...
*
*
*
* Controlling the page content width is as simple as adjusting
* the max-width property of the .main class. THAT VALUE NEEDS TO
* MATCH THE FIRST MEDIA QUERY VALUE IN THE RESPONSIVE SECTION.
--------------------------------------------------------------*/
.full { /* this class creates the full-width structure */
width: 100%;
}
.main { /* this class controls main design width and alignment within the above class */
margin: 0 auto;
width: 100%;
max-width: 1040px; /* THIS SHOULD MATCH THE FIRST MEDIA QUERY VALUE */
}
.inner { /* this class insulates actual site content from the two important classes it's nested under */
position: relative;
padding: 32px 0;
}
.site-content.inner {
padding: 60px 0;
}
#primary,
#secondary {
float: left;
}
#primary { /* content */
padding-right: 50px;
width: 70%;
}
#secondary { /* sidebar */
width: 30%;
}
/*--------------------------------------------------------------
2.0 Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea,
.site-description {
color: #333;
font-family: 'Nobile', 'Lucida Grande', sans-serif;
font-size: 16px;
line-height: 1.5;
}
h1, h2, h3, h4, h5, h6, .site-title a, .widget-title {
font-family: 'Droid Sans', 'Helvetica Neue', Helvetica, sans-serif;
clear: both;
margin-bottom: 15px;
letter-spacing: -1px;
}
h1, h2 {
font-size: 24px;
}
h3, h4 {
font-size: 20px;
}
h5, h6 {
font-size: 15px;
}
p {
margin-bottom: 1.5em;
}
b, strong {
font-weight: bold;
}
dfn, cite, em, i {
font-style: italic;
}
blockquote {
position: relative;
padding: 20px 20px 20px 40px;
margin: 20px 0;
text-shadow: #fff 0 1px 1px;
color: #373737;
font-weight: 500;
border-left: 5px solid #d2625a;
background: #f1f1f1;
background-size: 3px 3px;
quotes: "\201C" "\201D" "\2018" "\2019";
clear: both;
}
address {
margin: 0 0 1.5em;
}
pre {
background: #eee;
font-family: "Courier 10 Pitch", Courier, monospace;
font-size: 15px;
line-height: 1.6;
margin-bottom: 1.6em;
max-width: 100%;
overflow: auto;
padding: 1.6em;
}
code, kbd, tt, var {
font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}
abbr, acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
mark, ins {
background: #fff9c0;
text-decoration: none;
}
sup,
sub {
font-size: 75%;
height: 0;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
bottom: 1ex;
}
sub {
top: .5ex;
}
small {
font-size: 75%;
}
big {
font-size: 125%;
}
/*--------------------------------------------------------------
3.0 Elements
--------------------------------------------------------------*/
hr {
background-color: #ccc;
border: 0;
height: 1px;
margin-bottom: 1.5em;
}
ul, ol {
margin: 0 0 1.5em 3em;
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
li > ul,
li > ol {
margin-bottom: 0;
margin-left: 1.5em;
}
dt {
font-weight: bold;
}
dd {
margin: 0 1.5em 1.5em;
}
img {
height: auto; /* Make sure images are scaled correctly. */
max-width: 100%; /* Adhere to container width. */
}
figure {
margin: 0;
}
table {
margin: 0 0 1.5em;
width: 100%;
}
th {
font-weight: bold;
}
/*--------------------------------------------------------------
3.1 Tables
--------------------------------------------------------------*/
table {
border-collapse: collapse;
margin-bottom: 3em;
width: 100%;
background: #fff;
}
td, th {
padding: 0.75em 1.5em;
text-align: left;
}
td.err {
background-color: #d2625a;
color: #fff;
font-size: 0.75em;
text-align: center;
line-height: 1;
}
th {
background-color: #d2625a;
font-weight: bold;
color: #fff;
white-space: nowrap;
}
tbody th {
background-color: #d2625a;
}
tbody tr:nth-child(2n-1) {
background-color: #f5f5f5;
transition: all .125s ease-in-out;
}
tbody tr:hover {
background-color: rgba(246, 193, 193, 0.7);
}
/*--------------------------------------------------------------
4.0 Forms
--------------------------------------------------------------*/
button,
input,
select,
textarea {
font-size: 100%; /* Corrects font size not being inherited in all browsers */
margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
vertical-align: baseline; /* Improves appearance and consistency in all browsers */
*vertical-align: middle; /* Improves appearance and consistency in IE6/IE7 */
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
cursor: pointer; /* Improves usability and consistency of cursor style between image-type 'input' and others */
-webkit-appearance: button; /* Corrects inability to style clickable 'input' types in iOS */
font-size: 12px;
font-size: 1.2rem;
line-height: 1;
padding: 15px;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
background: #45637f;
}
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
border-color: #aaa #bbb #bbb #bbb;
box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.5), inset 0 2px 5px rgba(0, 0, 0, 0.15);
}
input[type="checkbox"],
input[type="radio"] {
padding: 0; /* Addresses excess padding in IE8/9 */
}
input[type="search"] {
-webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */
-webkit-box-sizing: content-box; /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */
-moz-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
-webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
border: 0;
padding: 0;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
color: #666;
border: none;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
color: #111;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"] {
padding: 3px;
}
textarea {
overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
padding-left: 3px;
vertical-align: top; /* Improves readability and alignment in all browsers */
width: 98%;
}
#secondary input[type="search"] {
min-width: 215px;
border: none;
padding: 8px
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="tel"],
input[type="number"],
textarea {
background: #f1f1f1;
border: none;
padding: 8px;
}
input[type="submit"] {
display: inline-block;
background: #d2625a;
color: #FFF;
font-size: 18px;
text-decoration: none;
padding: 15px;
border: none;
border-radius: 0;
}
/*--------------------------------------------------------------
5.0 Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
5.1 Links
--------------------------------------------------------------*/
a {
color: #d2625a;
}
a:hover,
a:focus,
a:active {
color: #45637f;
}
/*--------------------------------------------------------------
5.2 Menus
--------------------------------------------------------------*/
.header-menu {
position: absolute;
right: 0;
top: 30px;
}
.header-menu ul {
list-style: none;
margin: 0;
padding-left: 0;
}
.header-menu li {
float: left;
position: relative;
}
.header-menu li:not(:last-child) {
padding-right: 24px;
}
.menu-toggle {
display: block;
color: #fff;
text-decoration: none;
padding: 15px;
}
.header-menu a {
color: #fff;
font-size: 14px;
text-decoration: none;
}
.header-menu a:hover {
color: #45637f;
font-size: 14px;
text-decoration: none;
}
.skip-link.screen-reader-text {
padding: 0;
}
.header-menu ul ul {
display: none;
}
/* Small menu */
.menu-toggle {
cursor: pointer;
display: none;
padding: 18px;
}
.site-main .comment-navigation,
.site-main .paging-navigation,
.site-main .post-navigation {
margin: 0 0 1.5em;
overflow: hidden;
}
.content-area .paging-navigation,
.navigation.post-navigation,
.comments-area .comment-navigation,
.content-area .store-pagination {
font-size: 13px;
padding: 10px 0;
}
.comment-navigation .nav-previous,
.paging-navigation .nav-previous,
.post-navigation .nav-previous {
float: left;
width: 48%;
}
.social-links {
margin-top: 10px;
}
.social-links .fa {
color: #fff;
margin-right: 3px;
}
.navigation a,
.comment-navigation a {
color: #d2625a;
}
.navigation a:hover,
.page-numbers.current,
.comment-navigation a:hover {
color: #e44e44;
}
.nav-previous .fa {
margin-right: 6px;
}
.nav-next .fa {
margin-left: 6px;
}
.page-links {
clear: both;
margin: 0 0 1.5em;
}
.comment-navigation .nav-next,
.paging-navigation .nav-next,
.post-navigation .nav-next {
float: right;
text-align: right;
width: 48%;
}
/*--------------------------------------------------------------
6.0 Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers */
.screen-reader-text {
clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
color: #21759b;
display: block;
font-size: 14px;
font-weight: bold;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000; /* Above WP toolbar */
}
/*--------------------------------------------------------------
7.0 Alignments
--------------------------------------------------------------*/
.alignleft {
display: inline;
float: left;
margin-right: 1.5em;
}
.alignright {
display: inline;
float: right;
margin-left: 1.5em;
}
.aligncenter {
clear: both;
display: block;
margin: 0 auto;
}
/*--------------------------------------------------------------
8.0 Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
content: '';
display: table;
}
.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
clear: both;
}
/*--------------------------------------------------------------
9.0 Widgets
--------------------------------------------------------------*/
#secondary {
font-size: 13px;
padding-top: 40px;
}
.widget {
margin: 0 0 45px;
}
.widget-title {
display: block;
font-size: 15px;
font-weight: bold;
margin-bottom: 10px;
}
.widget ul {
margin: 0;
}
.widget .children {
border-top: 1px solid #D5E1E4;
margin: 5px 0 0;
}
.widget li {
list-style: none;
padding: 5px 0 0;
}
.widget li:not(:last-child) {
padding-bottom: 5px;
border-bottom: 1px solid #D5E1E4;
}
.widget li a {
text-decoration: none;
}
.widget li a:hover {
text-decoration: underline;
}
/* Make sure select elements fit in widgets */
.widget select {
max-width: 100%;
}
/* Search widget */
.widget_search .search-submit {
display: none;
}
.widget_calendar table {
background: #fff;
border: 1px solid #D5E1E4;
}
.widget_calendar table caption {
background: none;
font-weight: bold;
font-size: 15px;
padding: 15px 15px 15px 0;
}
.widget_calendar table th,
.widget_calendar table td {
text-align: center;
}
.widget_calendar table th {
padding: 8px 6px;
}
.widget_calendar table > thead > tr {
background: #34495E;
color: #fff;
}
.widget_calendar table td {
padding: 6px;
}
.widget_calendar table tfoot td {
padding-bottom: 8px;
}
.widget_calendar .widget-title {
display: none;
}
#secondary .widget .wp-caption img {
vertical-align: bottom;
}
#secondary .widget .wp-caption-text {
background: #FFF;
padding: 10px;
margin: 0;
}
/*--------------------------------------------------------------
10.0 Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
10.1 Posts and pages
--------------------------------------------------------------*/
#content-area {
background: #f1f1f1;
}
.content-area {
margin-top: 40px;
}
.sticky {
}
.hentry {
position: relative;
background: #fff;
margin: 0 0 30px;
}
.entry-header,
.entry-summary,
.entry-content,
.entry-footer {
padding: 15px 20px;
}
.entry-header {
padding-bottom: 0;
}
.entry-footer {
padding-bottom: 0;
}
.featured-img {
vertical-align: bottom;
}
.entry-title {
margin-bottom: 5px;
}
.entry-title a {
display: block;
color: #404040;
text-decoration: none;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-o-transition: all .2s;
transition: all .2s;
}
.entry-meta a {
color: #d2625a;
text-decoration: none;
}
.entry-title a:hover {
color: #45637f;
}
.entry-meta {
font-size: 13px;
}
.byline,
.updated {
display: none;
}
.single .byline,
.group-blog .byline {
display: inline;
}
.byline, .posted-on {
margin-right: 2em;
}
.entry-header .entry-meta .fa,
.entry-meta .tax-links .fa {
margin-right: 6px;
color: #45637f;
}
.entry-meta .fa {
margin-right: 6px;
color: #45637f;
}
.comments-link .fa {
margin-right: 3px;
}
.cats-tags {
display: block;
}
.entry-summary p:last-child {
margin-bottom: 0;
}
.excerpt-link {
text-align: right;
}
.entry-meta .read-more {
color: #d2625a;
position: absolute;
display: inline-block;
right: 20px;
bottom: 15px;
text-decoration: none;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-o-transition: all .2s;
transition: all .2s;
}
.read-more:hover {
color: #e44e44;
}
.read-more i {
margin-left: 3px;
}
.page-links {
clear: both;
margin: 0 0 1.5em;
}
body {
background: #d2625a;
}
.sidenote, .edd_has_purchased {
color: #ffffff;
background: #45637f;
border: 15px solid #748BA0;
border-width: 0 0 0 15px;
margin: 30px -75px;
padding: 30px 75px 30px 60px;
}
.single-post-footer {
margin-bottom: 3em;
}
.single-post-footer {
color: #fff;
padding: 15px 20px;
background: #45637f;
}
.single-post-footer .post-footer-author {
position: relative;
border-bottom: 2px solid rgba(0,0,0,.05);
margin-bottom: 1.5em;
}
.post-footer-author-bio p:last-child {
margin-bottom: 0;
}
.post-footer-author .avatar {
border-radius: 50%;
margin: 6px 6px 12px 0;
vertical-align: middle;
}
.author-name {
display: inline-block;
font-size: 18px;
}
.page-header {
background: #45637f;
padding: 15px 20px;
color: #fff;
margin-bottom: 30px;
}
.author-description,
.taxonomy-description {
font-family: 'Nobile', 'Lucida Grande', sans-serif;
font-size: 16px;
font-weight: 300;
}
.error404 #primary {
float: none;
margin: 0 auto;
padding: 0;
width: 640px;
}
.error-404 {
margin-top: 40px;
}
/*--------------------------------------------------------------
Header
--------------------------------------------------------------*/
#header-area {
background: #d2625a;
}
.site-header.inner {
padding: 0;
}
.header-elements {
padding: 32px 0;
}
.site-title {
display: inline-block;
margin-bottom: 10px;
}
.site-title a {
color: #fff;
text-decoration: none;
font-size: 2em;
}
.site-title a:hover {
color: #45637f;
}
.site-description {
font-size: 13px;
font-weight: normal;
color: #333;
margin-bottom: 0;
}
.site-branding {
padding: 16px;
}
/*--------------------------------------------------------------
10.2 Asides
--------------------------------------------------------------*/
.blog .format-aside .entry-title,
.archive .format-aside .entry-title {
display: none;
}
/*--------------------------------------------------------------
10.3 Comments
--------------------------------------------------------------*/
.comments-area {
background: #fff;
padding: 15px 20px;
}
.comment-form label {
display: inherit;
}
#respond {
margin-top: 2em;
}
.response-title {
font-style: italic;
}
.comment-body {
font-size: 14px;
}
.comment-content a {
word-wrap: break-word;
text-decoration: none;
}
.comment-body .comment-meta {
position: relative;
font-size: 13px;
border-width: 1px 0;
margin-bottom: 1.5em;
}
.comment-meta a {
text-decoration: none;
}
.pingback {
position: relative;
font-size: 13px;
}
.comment-author {
background: #F5F5F5;
padding: 6px 10px;
border-left: 5px solid #d2625a;
}
.comment-author .avatar {
border-radius: 50%;
margin: 6px 6px 6px 0;
}
.comment-author a,
.comment-metadata a {
color: #d2625a;
}
.comment-author a:hover,
.comment-metadata a:hover {
color: #45637f;
}
.comment-metadata {
position: absolute;
top: 20px;
right: 10px;
}
.comment-author .fn,
.comment-author .says {
position: relative;
top: -12px;
}
.comment-list {
margin-left: 0;
}
ol.comment-list, li.comment {
list-style: none;
}
.comment-list > .parent [class*="depth-"] {
padding-left: 24px;
margin-left: 0;
}
.comment {
margin-top: 2.5em;
}
.comment-reply-link {
color: #d2625a;
font-size: 13px;
}
#comment-nav-below {
margin-top: 16px;
}
.comment-navigation {
padding: 0;
border: none;
}
.no-comments { /* comments closed */
font-size: 13px;
background: #FFFFE0;
padding: 5px 10px;
text-align: center;
}
.bypostauthor .comment-author {
color: #fff;
padding: 6px 10px;
background: #45637f;
border-left: 5px solid #999;
}
.bypostauthor .comment-metadata a,
.bypostauthor .comment-meta a.url {
color: #fff;
}
.bypostauthor .comment-metadata a:hover,
.bypostauthor .comment-meta a.url:hover {
color: #999;
}
/*--------------------------------------------------------------
Footer
--------------------------------------------------------------*/
#footer-area{
background: #d2625a;
}
.site-footer {
color: #fff;
font-size: 14px;
}
.site-footer a {
color: #fff;
text-decoration: none;
}
.site-footer a:hover {
color: #fff;
text-decoration: none;
}
/*--------------------------------------------------------------
11.0 Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .paging-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
display: none;
}
/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */
.infinity-end.neverending .site-footer {
display: block;
}
/*--------------------------------------------------------------
12.0 Media
--------------------------------------------------------------*/
.page-content img.wp-smiley,
.entry-content img.wp-smiley,
.comment-content img.wp-smiley {
border: none;
margin-bottom: 0;
margin-top: 0;
padding: 0;
}
/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
max-width: 100%;
}
/*--------------------------------------------------------------
12.1 Captions
--------------------------------------------------------------*/
.wp-caption {
margin-bottom: 1.5em;
max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
display: block;
margin: 0 auto;
}
.wp-caption-text {
text-align: center;
}
.wp-caption .wp-caption-text {
margin: 0.8075em 0;
}
/*--------------------------------------------------------------
12.2 Galleries
--------------------------------------------------------------*/
.gallery {
margin-bottom: 1.5em;
}
.gallery-item {
display: inline-block;
text-align: center;
vertical-align: top;
width: 100%;
}
.gallery-columns-2 .gallery-item {
max-width: 50%;
}
.gallery-columns-3 .gallery-item {
max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
max-width: 25%;
}
.gallery-columns-5 .gallery-item {
max-width: 20%;
}
.gallery-columns-6 .gallery-item {
max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
max-width: 11.11%;
}
.gallery-caption {}
/*--------------------------------------------------------------
Responsive
--------------------------------------------------------------*/
@media screen and (max-width: 1040px) {
.main {
padding-right: 20px;
padding-left: 20px;
}
}
@media screen and (max-width: 768px) {
#header-area {
margin-bottom: -20px;
}
.site-header {
text-align: center;
}
.header-menu {
position: static;
margin-bottom: 20px;
}
.header-menu ul {
text-align: center;
margin-top: 16px;
}
.site-header .header-menu li {
display: inline-block;
float: none;
padding: 0 10px;
}
.main-navigation {
padding-left: 0;
margin-top: 15px;
}
.menu-toggle,
.main-navigation.toggled .nav-menu {
display: block;
text-align: center;
}
.main-navigation ul,
.comment-metadata {
display: none;
}
.main-navigation ul ul {
display: block;
float: none;
position: static;
box-shadow: none;
}
.main-navigation li {
float: none;
}
.main-navigation ul ul a {
width: 100%;
}
.header-area .main-navigation ul li:hover > ul {
background: none;
}
#primary,
#secondary {
float: none;
padding: 32px 0;
width: 100%;
}
#secondary {
padding: 0;
border: none;
}
.widget {
margin-bottom: 1.5em;
}
}
@media screen and (max-width: 550px) {
.entry-title {
font-size: 24px;
}
.comments-link {
display: inline-block;
float: none;
}
}