Skip to content

Instantly share code, notes, and snippets.

@shazdeh
Last active March 30, 2016 18:35
Show Gist options
  • Save shazdeh/884128cce60b999bd98e0dbd625188ea to your computer and use it in GitHub Desktop.
Save shazdeh/884128cce60b999bd98e0dbd625188ea to your computer and use it in GitHub Desktop.
Parallax Child theme
<?php
function custom_enqueue_scripts() {
wp_deregister_style( 'google-fonts' );
wp_enqueue_style( 'google-fonts', themify_https_esc('http://fonts.googleapis.com/css'). '?family=Crete+Round|Vidaloka|Alice');
}
add_action( 'wp_enqueue_scripts', 'custom_enqueue_scripts', 12 );
/*
Theme Name: Parallax Child
Template: parallax
*/
/************************************************************************************
RESET
*************************************************************************************/
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset, figure {
margin: 0;
padding: 0;
}
img, fieldset {
border: 0;
}
/* set img max-width */
img {
max-width: 100%;
height: auto;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
/* ie 8 img max-width */
@media \0screen {
img { width: auto;}
}
/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
/* audio */
audio {
max-width: 100%;
}
/* iframes and objects max-width */
iframe, object {
max-width: 100%;
}
/************************************************************************************
GENERAL STYLING
*************************************************************************************/
html,
body {
-webkit-font-smoothing: antialiased;
}
body {
font: normal 1em/1.62em "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
color: #8d8d8d;
background-color: #fff;
word-wrap: break-word;
}
a {
color: #6a94c6;
text-decoration: underline;
outline: none;
}
a:hover {
text-decoration: none;
}
p {
margin: 0 0 1.8em;
padding: 0;
}
small {
font-size: 87%;
}
blockquote {
font: italic 110%/130% "Times New Roman", Times, serif;
padding: 8px 30px 15px;
}
ins {
text-decoration: none;
}
/* LIST
================================================ */
ul, ol {
margin: 1em 0 1.4em 24px;
padding: 0;
line-height: 140%;
}
li {
margin: 0 0 .5em 0;
padding: 0;
}
/* HEADINGS
================================================ */
h1, h2, h3, h4, h5, h6 {
font-family: 'Crete Round';
line-height: 1.4em;
margin: 1.6em 0 .6em;
font-weight: normal;
word-wrap: normal;
}
h1 {
font-size: 3.2em;
}
h2 {
font-size: 3em;
line-height: 1em;
margin: 0;
padding: 0 0 .5em;
}
h3 {
font: normal 1.5em/1em Alice;
margin: 0;
padding: 0 0 2em;
}
h4 {
font-size: 1.35em;
}
h5 {
font-size: 1.2em;
}
h6 {
font-size: 1em;
}
/* FORM
================================================ */
/* form input */
input, textarea, select, input[type=search], button {
font-size: 100%;
font-family: inherit;
}
textarea, input[type=text], input[type=password], input[type=search], input[type=email], input[type=url] {
background-color: #fff;
border: 1px solid #c5c5c5;
padding: 6px 10px;
border-radius: 5px;
box-shadow: inset 0 0 3px rgba(0,0,0,.2);
-webkit-appearance: none;
}
input[type=text], input[type=search], input[type=email], input[type=url] {
width: 240px;
max-width: 90%;
}
/* text area */
textarea {
line-height: 150%;
width: 94%;
}
/* form input:focus */
textarea:focus, input[type=text]:focus, input[type=password]:focus, input[type=search]:focus, input[type=email]:focus, input[type=url]:focus {
outline: none;
background-color: #eee;
}
/* form button */
input[type=reset], input[type=submit], button {
background-color: #86b0e2;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjM1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background-image: -moz-linear-gradient(top, rgba(255,255,255,0.35) 0%, rgba(0,0,0,0.1) 100%);
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
background-image: linear-gradient(to bottom, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
color: #fff;
text-transform: uppercase;
font-weight: bold;
font-size: 1em;
padding: 10px 25px 7px;
cursor: pointer;
border: 1px solid #5c7798;
border-radius: 5px;
box-shadow: inset 0 1px 1px rgba(255,255,255,.5);
}
/* form input:hover */
input[type=reset]:hover, input[type=submit]:hover, button:hover {
background-color: #8ab6eb;
color: #fff;
}
/************************************************************************************
STRUCTURE
*************************************************************************************/
#pagewrap, .pagewidth, #headerwrap, #header, #main-nav, #body, #layout, #content, .post, .author-box, .post-nav, .pagenav, #sidebar, .widget, #footerwrap, #footer {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#pagewrap {
height: 100%;
}
/* main page width */
.pagewidth {
width: 978px;
margin: 0 auto;
}
/* section fullwidth */
.sidebar-none.query-section #layout.pagewidth {
width: 100% !important;
max-width: 100% !important;
}
.sidebar-none.query-section .page-title,
.sidebar-none.query-section .page-content {
width: 978px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
/* body (middle container) */
#body {
max-width: 100%;
background-color: #fff;
overflow: hidden;
position: relative;
z-index: 0;
}
/* content */
#content {
width: 672px;
float: left;
padding: 95px 0 60px;
}
.sidebar-none #content {
width: 100%;
float: none;
}
.sidebar-none.query-section #content {
padding: 0;
}
/* sidebar */
#sidebar {
width: 252px;
float: right;
padding: 95px 0 60px;
}
/* sidebar left */
.sidebar-left #content {
float: right;
}
.sidebar-left #sidebar {
float: left;
}
/* set relative position */
#body,
.post,
#site-logo,
#searchform,
.post-image,
.social-widget,
#site-description,
.col2-1,
.col3-1,
.col3-2,
.col4-1,
.col4-2,
.col4-3 {
position: relative;
}
/* fullwidth content */
.full_width #layout {
width: 100%;
max-width: 100%;
}
.full_width #content {
padding: 0;
width: auto;
float: none;
}
.full_width #sidebar {
width: auto;
float: none;
}
/************************************************************************************
GRID
*************************************************************************************/
.col4-1,
.col4-2,
.col4-3,
.col3-1,
.col3-2,
.col2-1
{
margin-left: 3.2%;
float: left;
}
.col4-1 {
width: 22.6%;
}
.col4-2, .col2-1 {
width: 48.4%;
}
.col4-3 {
width: 74.2%;
}
.col3-1 {
width: 31.2%;
}
.col3-2 {
width: 65.6%;
}
.col.first,
.col4-1.first,
.col4-2.first,
.col4-3.first,
.col3-1.first,
.col3-2.first,
.col2-1.first
{
margin-left: 0;
clear: left;
}
/************************************************************************************
HEADER
*************************************************************************************/
#headerwrap {
width: 100%;
background:#000 url("images/header.jpg") 50% -10px;
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#header {
display: table; /* vertical align trick */
table-layout: fixed;
width: 100%;
height: 500px;
text-align: center;
position: relative;
}
#header hgroup {
display: table-cell; /* vertical align trick */
vertical-align: middle;
width: 100%;
max-width: 100%;
}
.home #headerwrap,
.home #header {
height: 100vh;
}
/*
SITE LOGO
================================================ */
#site-logo {
font: normal 4.3em/1em Vidaloka;
margin: 0 0 20px;
padding: 0;
}
#site-logo a {
color: #fff;
text-decoration: none;
}
#site-logo a:hover {
text-decoration: none;
}
/*
SITE DESCRIPTION
================================================ */
#site-description {
font: normal 1.25em/1em Alice;
margin: 0 0 30px;
padding: 0;
color: #fff;
}
/*
SOCIAL WIDGET
================================================ */
.social-widget {
margin: 8px 0 6px;
}
.social-widget a {
color: #fff;
text-decoration: none;
}
.social-widget a:hover {
text-decoration: none;
}
.social-widget .widget {
display: inline-block;
zoom:1;
*display:inline;
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
box-shadow: none;
}
.social-widget .widget a {
color: #fff;
}
.social-widget .widget div {
display: inline;
}
.social-widget .widgettitle {
width: auto;
font-weight: bold;
font-size: 1em;
font-family: inherit;
text-transform: none;
border: none;
letter-spacing: 0;
position: static;
display: inline-block;
zoom:1;
*display:inline;
margin: 5px 8px 2px 0;
padding: 0;
background: transparent;
box-shadow: none;
}
.social-widget ul {
margin: 6px 0 0 !important;
padding: 0;
display: inline;
}
.social-widget ul li {
padding: 0 2px 5px 0;
margin: 0;
display: inline-block;
zoom:1;
*display:inline;
border: none !important;
clear: none;
line-height: 1em;
}
.social-widget li img {
vertical-align: middle;
margin-top: -3px;
}
.social-links .icon-medium i {
padding: 6px;
}
/* rss */
.social-widget div.rss {
display: inline-block;
vertical-align: top;
}
.social-widget div.rss a {
display: inline-block;
background-color: #f26522;
padding: 6px;
width: 20px;
height: 20px;
border-radius: 100%;
}
.social-widget div.rss a:before {
content: "\f09e";
display: block;
padding-top: 1px;
font-size: 20px;
}
/*
SEARCH FORM
================================================ */
#header #searchform {
display: inline-block;
position: relative;
margin: 10px auto;
}
#header #searchform #s {
font-family: 'Old Standard TT', serif;
font-style: italic;
font-size: 1em;
width: 67px;
color: #a9a9a9;
background-color: #f2f2f2;
padding: 3px 3px 3px 30px;
border: none;
border-radius: 5em;
-webkit-transition: width .7s;
-moz-transition: width .7s;
transition: width .7s;
}
#header #searchform #s:focus {
width: 140px;
color: #333;
}
#headerwrap #searchform .icon-search:before {
font-family: FontAwesome;
content: "\f002";
color: inherit;
font-size: 1em;
position: absolute;
left: 8px;
top: 50%;
cursor: auto;
font-style: normal;
width: 1em;
height: 1em;
line-height: 1em;
margin-top: -.5em;
}
/*
MAIN NAVIGATION
================================================ */
#nav-bar {
background-color: #000;
background-color: rgba(0,0,0,.7);
position: absolute;
z-index: 9999;
bottom: 0;
left: 0;
width: 100%;
padding: 0;
margin: 0;
}
#nav-bar.fixed-nav-bar {
position: fixed;
top: 0;
bottom: auto;
left: 0;
}
.admin-bar.no-header #nav-bar,
.admin-bar #nav-bar.fixed-nav-bar {
top: 32px;
}
.no-header #nav-bar {
top: 0;
bottom: auto;
}
#main-nav {
text-align: center;
overflow: visible;
}
#main-nav li {
margin: 0;
padding: 0;
list-style: none;
display: inline-block;
zoom:1;
*display:inline;
position: relative;
}
/* main level link */
#main-nav a {
font: normal 1em/1.3em Alice;
color: #fff;
display: block;
padding: 20px 0;
margin: 0 13px;
text-decoration: none;
}
/* main level link :hover */
#main-nav a:hover {
color: #fff799;
}
/* current link */
#main-nav .current_page_item a,
#main-nav .current-menu-item a {
color: #fff799;
}
/* current link :hover */
#main-nav .current_page_item a:hover,
#main-nav .current-menu-item a:hover {
color: #fff799;
}
/* sub-levels link */
#main-nav ul a,
#main-nav .current_page_item ul a,
#main-nav ul .current_page_item a,
#main-nav .current-menu-item ul a,
#main-nav ul .current-menu-item a {
font: normal .85em/1.3em "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
color: #636363;
text-transform: none;
padding: 10px 0;
margin: 0;
display: block;
width: 170px;
background: none;
border-top: 1px solid #e5e5e5;
}
#main-nav ul li:first-child > a {
border-top: none;
}
/* sub-levels link :hover */
#main-nav ul a:hover,
#main-nav .current_page_item ul a:hover,
#main-nav ul .current_page_item a:hover,
#main-nav .current-menu-item ul a:hover,
#main-nav ul .current-menu-item a:hover {
color: #000;
}
/* dropdown ul */
#main-nav ul {
margin: 0 0 0 -100px;
padding: 5px 0;
list-style: none;
position: absolute;
background-color: #fff;
z-index: 1000;
display: none;
left: 50%;
border: solid 1px #ccc;
}
#main-nav ul:before {
position: absolute;
display: block;
content: ' ';
width: 0;
height: 0;
top: -8px;
left: 50%;
margin-left: -4px;
border-bottom: 8px solid #fff;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
z-index: -1;
}
#main-nav ul li {
background: none;
padding: 0 12px;
margin: 0;
float: none;
}
/* sub-levels dropdown */
#main-nav ul ul {
margin: 0 0 0 97px;
top: -6px;
text-align: left;
}
#main-nav ul ul:before {
top: 15px;
left: -17px;
margin-left: 0;
border-right: 8px solid #ccc;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
}
#main-nav ul ul:after {
display: none;
}
/* show dropdown ul */
#main-nav li:hover > ul {
display: block;
}
/* home navigation */
.home #main-nav ul {
bottom: 60px;
}
.home #main-nav ul ul {
bottom: auto;
}
.home #main-nav ul ul:before {
top: 15px;
border-right: 8px solid #ccc;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
}
.home #main-nav ul:before {
top: auto;
bottom: -8px;
border-bottom: none;
border-top: 8px solid #fff;
}
.home .fixed-nav-bar #main-nav ul {
bottom: auto;
top: 60px;
}
.home .fixed-nav-bar #main-nav ul ul {
top: -6px;
}
.home .fixed-nav-bar #main-nav ul:before {
bottom: auto;
top: -8px;
border-top: none;
border-bottom: 8px solid #fff;
}
.home .fixed-nav-bar #main-nav ul ul:before {
top: 15px;
left: -17px;
margin-left: 0;
border-right: 8px solid #ccc;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
}
/* Edge Menu */
#main-nav li.edge > ul {
left: auto;
right: 0;
}
#main-nav ul li.edge > ul {
left: auto;
right: 100%;
}
#main-nav li.edge > ul:before {
left: auto;
right: 20px;
}
.fixed-nav-bar #main-nav ul li.edge > ul:before,
#main-nav ul li.edge > ul:before {
left: auto;
right: -16px;
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
transform: rotate(180deg);
}
body.mobile-menu-visible {
position: relative;
overflow-y: hidden;
}
.body-overlay {
display: none;
background-color: rgba(255,255,255,.7);
width: 100%;
height: 100%;
position: fixed;
right: 300px;
top: 0;
z-index: 10000;
box-shadow: inset -1px 0 13px rgba(0,0,0,.13)
}
.body-overlay.body-overlay-on {
display: block; /* fix for Windows phone */
}
/************************************************************************************
PAGE
*************************************************************************************/
/* page title */
.page-title {
margin: 0 0 15px;
padding: 0;
font-size: 2.3em;
line-height: 110%;
}
/* query section page title */
.sidebar-none.query-section .page-title {
margin-top: 60px;
}
/*
AUTHOR PAGE
================================================ */
.author-bio {
margin: 0 0 30px;
}
.author-bio .author-avatar {
float: left;
margin: 0 15px 0 0;
}
.author-bio .author-avatar img {
border-radius: 5px;
}
.author-bio .author-name {
margin: 0 0 5px;
padding: 0;
font-size: 160%;
}
.author-posts-by {
margin: 0 0 20px;
padding: 10px 0 0;
font-size: 140%;
text-transform: uppercase;
border-top: solid 1px #ccc;
border-color: rgba(118,118,118,.3);
}
/*
CATEGORY SECTIONS
================================================ */
.category-section {
clear: both;
margin-bottom: 30px;
}
.category-section-title {
font-size: 120%;
text-transform: uppercase;
margin: 0 0 20px;
padding: 10px 0 0;
border-top: double 4px #ccc;
}
/************************************************************************************
PAGE NAVIGATION
*************************************************************************************/
.pagenav {
clear: both;
padding-bottom: 20px;
text-align: right;
}
.pagenav a, .pagenav span {
line-height: 100%;
padding: 4px 0 2px;
margin: 0 2px;
vertical-align: middle;
display: inline-block;
zoom:1;
*display:inline;
min-width: 24px;
min-height: 18px;
text-align: center;
border-radius: 10em;
}
.pagenav a {
background-color: #86b0e2;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjM1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background-image: -moz-linear-gradient(top, rgba(255,255,255,0.35) 0%, rgba(0,0,0,0.1) 100%);
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
background-image: linear-gradient(to bottom, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
color: #fff;
text-decoration: none;
box-shadow: inset 0 1px 1px rgba(255,255,255,.5);
border: 1px solid #5c7798;
}
.pagenav a:hover {
background-color: #8ab6eb;
}
.pagenav .current {
text-decoration: none;
}
/************************************************************************************
POST
*************************************************************************************/
.post {
margin-bottom: 40px;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
/* post title */
.post-title {
margin: 0 0 5px;
padding: 0;
font-size: 1.6em;
}
.post-title a {
text-decoration: none;
}
/* post-date */
.post-date {
display: block;
margin: 0 0 10px;
font-size: .8em;
opacity: .65;
position: relative; /* smooth IE text opacity */
}
.loops-wrapper.list-post .post-date {
margin-bottom: 20px;
}
/* post-content */
.post-content {
min-width: 120px;
}
/* post-image */
.post-image {
margin: 0 0 15px;
}
.post-image.left {
float: left;
margin-right: 15px;
}
.post-image.right {
float: right;
margin-left: 15px;
}
.post-image img {
vertical-align: bottom;
border-radius: 5px;
}
/* lightbox zoom image */
.post-image .lightbox {
position: relative;
display: inline-block;
zoom:1;
*display:inline;
max-width: 100%;
}
.post-image .lightbox .zoom {
width: 40px;
height: 40px;
background: url(images/icon-zoom.png) no-repeat center center;
margin: -20px 0 0 -20px;
position: absolute;
top: 50%;
left: 50%;
z-index: 1000;
border-radius: 10em;
}
.post-image .lightbox:hover .zoom {
background-color: #000;
}
/* post meta */
.post-meta {
display: inline-block;
padding: 0;
text-transform: uppercase;
line-height: 1.4em;
font-size: .75em;
margin-bottom: 5px;
opacity: .65;
position: relative; /* smooth IE text opacity */
}
.post-meta a {
font-weight: bold;
text-decoration: none;
}
/* list post */
.loops-wrapper.list-post .post {
margin-bottom: 60px;
text-align: left;
}
.loops-wrapper.list-post .post-content {
overflow: visible;
}
/* grid4 post */
.loops-wrapper.grid4 .post {
width: 22.6%;
float: left;
margin-left: 3.2%;
text-align: center;
}
.loops-wrapper.grid4 .post-title {
font-size: 135%;
margin: 0 0 6px;
padding: 0;
}
/* grid3 post */
.loops-wrapper.grid3 .post {
width: 31.2%;
float: left;
margin-left: 3.2%;
text-align: center;
}
.loops-wrapper.grid3 .post-title {
font-size: 160%;
margin: 0 0 6px;
padding: 0;
}
/* grid2 post */
.loops-wrapper.grid2 .post {
width: 48.4%;
float: left;
margin-left: 3.2%;
text-align: center;
}
.loops-wrapper.grid2 .post-title {
font-size: 160%;
margin: 0 0 6px;
padding: 0;
}
/* grid2-thumb post */
.loops-wrapper.grid2-thumb .post {
width: 48.4%;
float: left;
margin-left: 3.2%;
text-align: left;
}
.loops-wrapper.grid2-thumb .post-title {
font-size: 170%;
margin: 0 0 8px;
padding: 0;
}
.loops-wrapper.grid2-thumb .post-image {
max-width: 58%;
float: left;
margin-right: 6%;
min-width: 120px;
}
.loops-wrapper.grid2-thumb .post-content {
overflow: hidden;
}
/* clear grid posts */
.loops-wrapper.grid4 .post:nth-of-type(4n+1),
.loops-wrapper.grid3 .post:nth-of-type(3n+1),
.loops-wrapper.grid2 .post:nth-of-type(2n+1),
.loops-wrapper.grid2-thumb .post:nth-of-type(2n+1) {
margin-left: 0;
clear: left;
}
/************************************************************************************
POST SECTIONS
*************************************************************************************/
.section-post {
width:100%;
height: 100%;
min-height: 600px;
position: relative;
z-index: 0;
margin-bottom: 0 !important;
background-color: #333;
color: #ccc;
}
.section-post h1,
.section-post h2,
.section-post h3,
.section-post h4,
.section-post h5,
.section-post h6 {
color: inherit;
}
.section-post a {
color: #fff;
}
.section-post.repeat {
background-repeat: repeat;
}
.sidebar-none .section-post {
margin-bottom: 0;
}
.section-inner {
padding-top: 120px;
padding-bottom: 90px;
}
.sidebar-none .loops-wrapper.list-post .section-inner {
width: 978px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.sidebar1 .loops-wrapper.list-post .section-inner {
padding: 10% 5% 8%;
}
/* section title */
.section-title {
padding: 0;
margin: 0 0 10px;
font-size: 3em;
line-height: 1.1em;
text-align: center;
}
.section-subhead {
font: normal 1.5em/1.2em Alice;
margin: 0 0 5px;
padding: 0;
text-align: center;
}
/* section-content */
.section-content {
margin-top: 6%;
}
/*
FULLWIDTH SECTION
================================================ */
.section-post.fullwidth .section-inner {
width: 98% !important;
padding-left: 1%;
padding-right: 1%;
}
.full_width.sidebar-none .loops-wrapper .section-inner {
width: 100% !important;
padding-left: 0;
padding-right: 0;
}
/*
MESSAGE SECTION
================================================ */
.vertical-centered {
display: inline-block;
vertical-align: middle;
line-height: normal;
width: 100%;
}
.section-post.message .section-inner {
margin: 0 auto;
padding: 0;
}
.section-post.message {
font-size: 1.2em;
}
.section-post.message .section-title {
font-size: 3.5em;
}
.section-post.message .section-subhead {
font-size: 2em;
}
.section-post.message .section-content {
text-align: center;
margin-top: 2%;
}
.section-post.message .section-content h1,
.section-post.message .section-content h2,
.section-post.message .section-content h3 {
line-height: 1.4em;
margin: 0 0 1em;
}
.section-post.message .section-content h1 {
font-size: 1.5em;
}
.section-post.message .section-content h2 {
font-size: 1.25em;
}
.section-post.message .section-content h3 {
font-size: 1.15em;
}
/*
VIDEO SECTION
================================================ */
.section-post.video {
text-align: center !important;
}
.section-post .post-video {
width: 100%;
margin: auto;
}
.section-post.video .section-title {
padding: 5% 0 3%;
margin: 0;
}
.section-post.video .section-content {
margin: 0;
}
/* fullwidth video */
.section-post.video.fullwidth .section-inner {
width: 100%;
padding: 0;
}
#headerwrap .big-video-wrap {
overflow: hidden;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: 0;
position: absolute;
}
#headerwrap .big-video-vid,
#headerwrap .big-video-image {
position: absolute;
z-index: -2;
}
#headerwrap[data-fullwidthvideo] {
position: relative;
}
#headerwrap .vjs-big-play-button,
#headerwrap .vjs-control-bar,
#headerwrap .vjs-error-display,
#headerwrap .vjs-text-track-display {
display:none !important;
}
/*
SLIDER SECTION
================================================ */
.section-post.slider {
width: auto !important;
position: relative;
text-align: center !important;
}
.section-post.fullwidth.slider .section-content {
margin-left: 70px;
margin-right: 70px;
}
.slider-section {
position: absolute;
top: 50%;
left: 0;
width: 100%;
max-width: 100%;
margin: 0 auto;
z-index: 3;
height: 0 !important;
visibility: hidden;
}
.slider-section .carousel-wrap {
height: 0;
}
/* slider general style */
.slider-section .slider {
display: inline-block;
width: 100%;
}
.slider-section .slider .slides {
visibility: hidden;
margin: 0;
padding: 0;
line-height: 84%;
text-align: center !important;
}
.slider-section .slider .slides li {
list-style: none;
float: left;
display: inline-block;
margin: 0 auto;
}
.slider-section .slider-dot {
width: 12px;
height: 12px;
display: block;
margin: 0 auto;
border-radius: 1em;
background-color: #eee;
background-color: rgba(255,255,255,0.5);
border: 1px solid #e5e5e5;
border-color: rgba(0,0,0,0.2);
-webkit-transition: background-color 0.5s, opacity 0.5s;
-moz-transition: background-color 0.5s, opacity 0.5s;
transition: background-color 0.5s, opacity 0.5s;
}
.slider-section li:hover .slider-dot, .slider-section .current-slide .slider-dot {
background-color: #fff;
}
/* carousel nav */
.slider-section .slider .carousel-nav-wrap {
text-align: center;
height: 0;
}
.slider-section .slider .carousel-arrow{
display: inline-block;
}
.slider-section .carousel-nav-wrap a {
text-indent: -999em;
line-height: 1em;
margin: -36px 0 0;
width: 72px;
height: 72px;
text-decoration: none;
position: absolute;
top: 50%;
left: 0;
}
.slider-section .carousel-nav-wrap a.carousel-next {
right: 0;
left: auto;
}
.slider-section .carousel-nav-wrap a:before {
font: normal 64px/1em Themify;
color: #fff;
text-indent: 0;
position: absolute;
top: 50%;
left: 50%;
width: 1em;
height: 1em;
margin: -.5em 0 0 -.5em;
}
.slider-section .carousel-nav-wrap a.carousel-prev:before {
content: "\e64a";
}
.slider-section .carousel-nav-wrap a.carousel-next:before {
content: "\e649";
}
.slider-section .carousel-nav-wrap a:hover:before {
font-size: 72px;
}
/* carousel pager */
.slider-section .carousel-pager {
clear: both;
text-align: center;
margin: 10px 0;
}
.slider-section .carousel-pager a {
text-indent: -900em;
width: 10px;
height: 10px;
margin: 0 5px;
background-color: #eda93c;
box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255,255,255,.3);
border-radius: 10em;
cursor: pointer;
display: inline-block;
zoom:1;
*display:inline;
}
.slider-section .carousel-pager a.selected {
width: 4px;
height: 4px;
border: solid 3px #EDA93C;
background-color: #543a12;
box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.2);
}
/************************************************************************************
CUSTOM POST TYPE STYLES
*************************************************************************************/
/*
PORTFOLIO POST TYPE
================================================ */
/* portfolio featured slider */
.slideshow-wrap {
visibility: hidden;
height: 0;
overflow: hidden;
min-width: 120px;
}
.slideshow {
margin: 0;
padding: 0;
}
.slideshow li {
margin: 0;
padding: 0;
float: left;
list-style: none;
overflow: hidden;
text-align: center;
}
.single .slideshow li {
position: relative;
}
/* slider image caption */
.slider-image-caption {
position: absolute;
background-color: #222;
background-color: rgba(0,0,0,.6);
color: #fff;
display: inline;
bottom: 0;
left: 0;
padding: 5px 2%;
width: 96%;
}
/* slideshow nav wrap */
.portfolio-post .post-image .carousel-nav-wrap {
width: 100%;
padding: 0;
margin: 0;
}
.portfolio-post .post-image .carousel-prev,
.portfolio-post .post-image .carousel-next {
position: absolute;
width: 46px;
height: 50px;
display: block;
text-indent: -999em;
top: 50%;
margin-top: -20px;
padding: 0;
text-decoration: none;
}
.portfolio-post .post-image .carousel-prev,
.portfolio-post .post-image .carousel-prev:hover {
left: 0;
}
.portfolio-post .post-image .carousel-next,
.portfolio-post .post-image .carousel-next:hover {
right: 0;
}
.portfolio-post .post-image .carousel-prev:before,
.portfolio-post .post-image .carousel-next:before {
font: normal 30px/1em Themify;
color: #fff;
text-indent: 0;
position: absolute;
top: 50%;
left: 50%;
width: 1em;
height: 1em;
margin: -.5em 0 0 -.5em;
text-align: center;
}
.portfolio-post .post-image .carousel-prev:before {
content: "\e64a";
}
.portfolio-post .post-image .carousel-next:before {
content: "\e649";
}
.portfolio-post .post-image .carousel-pager {
width: 100%;
text-align: center;
clear: both;
height: auto;
padding: 5px 0 0;
position: absolute;
bottom: 5px;
}
.portfolio-post .post-image .carousel-pager li {
margin: 0;
padding: 0;
display: inline-block;
zoom:1;
*display:inline;
position: relative;
}
.portfolio-post .post-image .carousel-pager a {
text-indent: -900em;
text-decoration: none;
width: 8px;
height: 8px;
margin: 0 4px;
cursor: pointer;
background-color: #fff;
display: inline-block;
vertical-align: middle;
border-radius: 10em;
box-shadow: 0 0 0 2px rgba(255,255,255,0);
}
.portfolio-post .post-image .carousel-pager .selected {
background: transparent;
box-shadow: 0 0 0 2px rgba(255,255,255,1);
}
/* carousel loader icon */
.portfolio-loader {
display: none;
width: 54px;
height: 54px;
position: absolute;
top: 50%;
left: 50%;
margin: -27px 0 0 -27px;
background: #fff url(images/load.gif) center no-repeat;
border-radius: 10em;
}
.portfolio-post .post-image .slideshow-wrap + .portfolio-loader {
margin-top: -42px;
}
/* portfolio expanded */
.portfolio-expanded {
border-style: solid;
border-color: #4e4e4e;
border-color: rgba(255,255,255,.3);
border-width: 1px 0 1px 0;
padding: 30px 0;
margin-bottom: 40px;
position: relative;
clear: both;
overflow: hidden;
}
.single-portfolio-expanded {
background: none;
}
.single-portfolio-expanded .portfolio-post {
width: 100%;
text-align: left;
margin: 0;
padding: 0;
border: none;
}
.single-portfolio-expanded .post-content {
margin-right: 30px;
}
.single-portfolio-expanded .post-image,
.single-portfolio .post-image {
max-width: 58%;
float: left;
margin-right: 3%;
width: 670px;
}
.single-portfolio-expanded .post-title {
font-size: 1.6em;
}
.single-portfolio-expanded .close-expanded {
width: 27px;
height: 27px;
display: block;
text-indent: -9000em;
position: absolute;
top: 12px;
right: 0;
color: inherit;
}
.single-portfolio-expanded .close-expanded:before {
content: "\e646";
font: normal 24px/1em Themify;
position: absolute;
top: 0;
left: 0;
text-indent: 0;
}
.single-portfolio-expanded .close-expanded:hover:before {
-webkit-transform: rotate(90deg) scale(.8);
transform: rotate(90deg) scale(.8);
}
.single-portfolio-expanded .expand-arrow{
text-indent: -9000em;
position: absolute;
top: 12px;
color: inherit;
display: none;
}
.single-portfolio-expanded .expand-arrow:before{
font: normal 24px/1em Themify;
position: absolute;
top: 0;
left: 0;
text-indent: 0;
}
.single-portfolio-expanded .expand-prev {
right: 100px;
}
.single-portfolio-expanded .expand-next{
right: 70px;
}
.single-portfolio-expanded .post {
opacity: 1;
}
.single-portfolio-expanded .tb-column {
opacity: 1 !important;
}
.portfolio-expand-scaler {
position: relative;
height: 100%;
}
#portfolio-lightbox-iframe {
display: block;
width: 100%;
}
/*
TEAM POST TYPE
================================================ */
.team-post {
margin-bottom: 30px;
overflow: hidden;
}
.team-post .post-image img {
border-radius: 20em;
}
.team-post .team-info {
margin: 0 0 5px;
}
.team-post .team-info .team-name {
margin: 0 0 5px;
font: bold 100%/120% Arial, Helvetica, sans-serif;
text-transform: uppercase;
display: block;
}
.team-post .team-info .team-title {
display: block;
font: italic 100%/120% "Times New Roman", Times, serif;
}
.shortcode.team.list-post .post-image {
max-width: 58%;
float: left;
margin-right: 4.5%;
}
/* .team-social */
.team-social-link i {
font-size: 1.4em;
line-height: 1em;
margin: 0 4px 0;
display: inline-block;
}
.shortcode.team .team-social {
margin: 1em 0;
}
.shortcode.team .team-social a,
.team-social-link {
text-decoration: none;
}
.shortcode.team .team-social a i {
font-size: 1.5em;
margin-right: 10px;
}
.shortcode.team .team-slider .team-social a i {
font-size: 1.2em !important;
}
/* skillset-wrap */
.skillset-wrap h4 {
font: bold 100%/120% Arial, Helvetica, sans-serif;
text-transform: uppercase;
margin: 0 0 20px 0;
}
.shortcode.team.list-post .skillset-wrap .progress-bar-wrap,
.skillset-wrap .progress-bar-wrap {
display: block;
overflow: hidden;
}
.shortcode.team .skillset {
list-style: none;
margin: 0;
color: #000;
font-size: 0.875em;
text-align: left;
}
.shortcode.team .skillset li {
background-color: #eee;
margin: 0 0 12px;
border-radius: 5px;
}
/*
HIGHLIGHT POST TYPE
================================================ */
.shortcode.list-post .highlight-post .post-content {
margin-top: 15px;
}
.highlight-post .post-image {
float: none;
margin: 0 0 15px;
}
.highlight-post .post-image a {
position: relative;
display: block;
z-index: 1;
max-width: 100%;
}
.highlight-post i {
font-size: 4em;
position: relative;
padding: 25% 0;
vertical-align: middle;
}
.highlight-post .chart img {
border-radius: 100%;
}
.highlight-post .fa-background {
border-radius: 100%;
width: 75%;
height: 75%;
position: absolute;
left: 12.5%;
top: 12.5%;
}
.highlight-post .no-chart {
display: inline-block;
width: 60px;
height: 60px;
transition: width 1s ease-out, height 1s ease-out;
}
.highlight-post .no-chart i {
padding: 0;
transition: padding 1s ease-out;
}
.highlight-post .no-chart-ready i {
padding: 33% 0 0;
}
.highlight-post .no-chart {
height: auto !important;
}
/************************************************************************************
POST VIDEO (css for fluid video)
*************************************************************************************/
.post-video, .embed-youtube {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
margin-bottom: 15px;
}
.post-video iframe,
.post-video object,
.post-video embed,
.embed-youtube iframe,
.embed-youtube object,
.embed-youtube embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/************************************************************************************
AUTHOR BOX
*************************************************************************************/
.author-box {
margin: 15px 0;
}
.author-box .author-avatar {
float: left;
margin: 0 15px 5px 0;
}
.author-box .author-name {
margin: 0 0 5px;
}
/************************************************************************************
POST NAVIGATION (the <nextpage> tag)
*************************************************************************************/
.post-pagination {
text-align: right;
margin: .5em 0 2em;
}
.post-pagination strong {
margin-right: 3px;
}
.post-pagination a {
margin-left: 3px;
margin-right: 3px;
}
/************************************************************************************
POST NAVIGATION
*************************************************************************************/
.post-nav {
margin: 0 0 30px;
padding: 15px 0;
clear: both;
}
.post-nav .prev,
.post-nav .next {
width: 47%;
position: relative;
}
.post-nav a {
text-decoration: none;
display: block;
}
.post-nav a:hover {
text-decoration: none;
}
.post-nav .prev {
float: left;
}
.post-nav .next {
float: right;
text-align: right;
}
/* post nav arrow */
.post-nav .arrow {
color: #000;
font: normal 20px/100% "Times New Roman", Times, serif;
display: block;
float: left;
width: 32px;
height: 28px;
padding: 4px 0 0;
text-align: center;
margin: -3px 10px 17px 0;
text-indent: -999em;
border-radius: 10em;
}
.post-nav .arrow:before {
content: "\f104";
position: absolute;
top: -8px;
left: 6px;
font-size: 42px;
text-indent: 0;
}
.post-nav .next .arrow {
float: right;
margin-left: 10px;
margin-right: 0;
}
.post-nav .next .arrow:before {
content: "\f105";
left: auto;
right: 6px;
}
/************************************************************************************
COMMENTS
*************************************************************************************/
.commentwrap {
margin: 10px 0 20px;
position: relative;
clear: both;
}
/* comment title */
.comment-title, #reply-title {
font-size: 140%;
margin: 0 0 10px;
padding: 0;
}
/* comment pagenav */
.commentwrap .pagenav {
margin: 10px 0;
border: none;
box-shadow: none;
}
.commentwrap .pagenav.top {
margin: 0;
position: absolute;
top: 0;
right: 0;
}
/* commentlist */
.commentlist {
margin: 0 0 30px;
padding: 5px 0 0;
border-top: solid 1px #f2f2f2;
}
.commentlist li {
margin: 0;
padding: 15px 0 0;
list-style: none;
position: relative;
}
.commentlist .comment-author {
margin: 2px 0 10px;
padding: 0;
}
.commentlist .avatar {
float: left;
margin: 0 15px 0 0;
}
.commentlist cite {
font-size: 130%;
font-family: 'Crete Round';
font-style: normal;
}
.commentlist cite a {
text-decoration: none;
}
.commentlist .bypostauthor > .comment-author cite {
background: url(images/icon-author-comment.png) no-repeat 0 2px;
padding-left: 18px;
}
.commentlist .comment-time {
font-size: 75%;
text-transform: uppercase;
}
.commentlist .commententry {
border-bottom: solid 1px #f2f2f2;
position: relative;
min-height: 40px;
overflow: hidden;
padding-bottom: 5px;
word-wrap: break-word;
}
.commentlist ul, .commentlist ol {
margin: 0 0 0 7%;
padding: 0;
}
/* reply link */
.commentlist .reply {
position: absolute;
right: 0;
top: 8px;
}
.commentlist .comment-reply-link {
font-size: 11px;
text-transform: uppercase;
text-decoration: none;
}
.commentlist .comment-reply-link:hover {
text-decoration: none;
}
/*
COMMENT FORM
================================================ */
#respond {
margin: 0;
padding: 10px 0 0;
position: relative;
clear: both;
}
#respond #cancel-comment-reply-link {
position: absolute;
top: 20px;
right: 0;
font-size: 85%;
line-height: 100%;
text-decoration: none;
padding: 5px 10px;
display: block;
color: #fff;
border: solid 1px #9e0b0f;
background-color: #e41d24;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjM1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background-image: -moz-linear-gradient(top, rgba(255,255,255,0.35) 0%, rgba(0,0,0,0.1) 100%);
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
background-image: linear-gradient(to bottom, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.2);
border-radius: 5px;
}
#respond #cancel-comment-reply-link:hover {
background-color: #fb4e55;
}
#commentform {
margin: 15px 0 0;
}
#commentform input[type=text] {
width: 206px;
margin-right: 5px;
}
#commentform label {
font-weight: bold;
}
#commentform label small {
font-weight: normal;
}
#commentform textarea {
height: 140px;
}
#commentform input#submit {
font-size: .9em;
padding: 7px 20px;
}
/************************************************************************************
SIDEBAR
*************************************************************************************/
#sidebar {
font-size: .9em;
line-height: 1.4em;
}
.widget {
margin: 0 0 30px;
word-wrap: break-word;
}
.widget a {
color: #6a94c6;
text-decoration: none;
}
.widgettitle {
font: bold 1.1em/1.62em "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
text-transform: uppercase;
margin: 0 0 10px;
padding: 0;
}
.widgettitle a {
color: #000;
}
.widget ul {
margin: 0;
padding: 0;
}
.widget li {
margin: 0;
padding: 6px 0;
list-style: none;
clear: both;
border-top: solid 1px #f2f2f2;
}
.widget li:first-child {
border: none;
}
.widget ul ul {
margin: 6px 0 -6px 0;
padding: 0;
border-top: none;
}
.widget ul ul li {
margin: 0;
padding-left: 10px;
}
/************************************************************************************
WIDGET STYLES
*************************************************************************************/
/* calendar widget */
.widget #wp-calendar caption {
font-weight: bold;
padding-bottom: 10px;
}
.widget #wp-calendar td {
width: 31px;
padding: 4px 2px;
text-align: center;
}
/* feature posts widget */
.widget .feature-posts-list br {
display: none;
}
.widget .feature-posts-list .post-img {
margin: 4px 12px 10px 0;
float: left;
border-radius: 5px;
}
.widget .feature-posts-list small {
font-style: italic;
font-size: 90%;
display: block;
margin: 0 0 3px;
}
.widget .feature-posts-list .feature-posts-title {
margin: 4px 0 3px;
}
.widget .feature-posts-list .post-excerpt {
display: block;
}
/* twitter widget */
.widget .twitter-list .twitter-timestamp a {
font-style: italic;
font-size: 90%;
}
.widget .follow-user {
margin: 0;
padding: 5px 0;
}
/* instagram widget */
#masonryContainer {
padding: 0 !important;
border-radius: 0 !important;
}
.masonryItem, .masonryItem hr {
max-width: 94px !important;
margin: 3px !important;
margin-bottom: 0 !important;
padding: 0 !important;
background: none !important;
box-shadow: none !important;
border: none !important;
}
.front-photo {
width: 94px !important;
margin-right: 0 !important;
}
.item-holder {
width: 94px !important;
}
/* links widget */
.widget .links-list img, .widget_links img {
vertical-align: middle;
}
/* recent comments widget */
.recent-comments-list .avatar {
margin-right: 12px;
float: left;
}
/* flickr widget */
.widget .flickr_badge_image {
margin-top: 10px;
}
.widget .flickr_badge_image img {
width: 50px;
height: 50px;
margin-right: 12px;
margin-bottom: 12px;
float: left;
}
/* flickr shortcode */
.shortcode .flickr_badge_image {
width: 23.8%;
margin: 0 1.5% 1.5% 0;
float: left;
}
.shortcode .flickr_badge_image:nth-of-type(4n) {
margin-right: 0;
}
.shortcode .flickr_badge_image img {
margin: 0;
}
/* search widget */
#sidebar #searchform {
position: static;
}
#sidebar #searchform #s {
width: 93%;
}
/* add white bg to facebook badge iframe */
iframe[src*="facebook"] {
background-color: #fff;
}
/* reset twitter embed max-width to 100% */
#content .twitter-tweet-rendered {
max-width: 100% !important;
}
#content .twt-border {
max-width: 100% !important;
min-width: 180px !important;
}
/************************************************************************************
LOAD MORE BUTTON
*************************************************************************************/
#load-more {
clear: both;
margin: 30px 0 10px;
right: 44%;
text-align: center;
}
#load-more a {
background-color: #86b0e2;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjM1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background-image: -moz-linear-gradient(top, rgba(255,255,255,0.35) 0%, rgba(0,0,0,0.1) 100%);
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
background-image: linear-gradient(to bottom, rgba(255,255,255,0.35) 0%,rgba(0,0,0,0.1) 100%);
color: #fff;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
font-size: 1em;
padding: 10px 25px 7px;
cursor: pointer;
border: 1px solid #5c7798;
border-radius: 5px;
box-shadow: inset 0 1px 1px rgba(255,255,255,.5);
}
#load-more a:hover {
background-color: #8ab6eb;
color: #fff;
}
/************************************************************************************
INFINITE SCROLL
*************************************************************************************/
#infscr-loading {
position: fixed;
text-align: center;
bottom: 30px;
left: 50%;
width: 50px;
height: 41px;
padding-top: 9px;
margin-left: -25px;
z-index: 100;
background-color: white;
background-color: hsla( 0, 0%, 100%, 0.9 );
overflow: hidden;
border-radius: 50em;
}
/************************************************************************************
FOOTER
*************************************************************************************/
#footerwrap {
background-color: #000;
overflow: hidden;
}
#footer {
color: #666;
clear: both;
padding: 20px 0 50px;
}
#footer a {
text-decoration: none;
color: #999;
}
#footer a:hover {
color: #fff;
}
/* footer widget lists */
#footer .widget li {
border-color: #2b2b2b;
}
/* footer text */
.footer-text {
font-size: .75em;
display: block;
margin: 0 auto;
padding-top: 30px;
text-align: center;
}
.footer-text a {
color: #b8b8b8;
}
.footer-text a:hover {
text-decoration: underline;
}
/* footer menu */
.footer-nav {
padding: 0;
margin: 40px 0 10px;
text-align: center;
}
.footer-nav li {
padding: 0;
margin: 0 10px;
list-style: none;
display: inline-block;
zoom:1;
*display:inline;
}
/* back to top */
.back-top {
font: normal .93em/1em Alice;
text-transform: uppercase;
display: block;
width: 35%;
margin: 30px auto 0;
padding-bottom: 35px;
text-align: center;
border-bottom: 1px solid #2b2b2b;
}
.back-top a {
color: #b8b8b8;
}
.back-top a:hover {
color: #fff;
}
.back-top a:before {
font-family: Themify;
font-size: 48px;
display: block;
content: "\e648";
padding: 0 0 30px;
}
.back-top a:hover:before {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
/************************************************************************************
FULLSCREEN GALLERY
*************************************************************************************/
#headerwrap.header-gallery-ready {
background: none;
}
/* gallery controller */
#gallery-controller {
width: 100px;
max-width: 100%;
margin: 0 auto;
z-index: 3;
height: 0;
visibility: hidden;
}
#gallery-controller .carousel-wrap {
margin-top: 35px;
}
/* slider general style */
#gallery-controller .slider {
padding-bottom: 10px;
display: inline-block;
width: 100%;
}
#gallery-controller .slider .slides {
margin: 0;
padding: 0;
line-height: 84%;
text-align: center !important;
}
#gallery-controller .slider .slides li {
list-style: none;
float: left;
display: inline-block;
margin: 0 auto;
}
#gallery-controller .slider-dot {
width: 12px;
height: 12px;
display: block;
margin: 0 auto;
border-radius: 1em;
background-color: #fff;
border: solid 2px transparent;
}
#gallery-controller li:hover .slider-dot,
#gallery-controller .current-slide .slider-dot {
background: transparent;
border: solid 2px #fff;
}
/* carousel nav */
#gallery-controller .slider .carousel-nav-wrap {
text-align: center;
margin: 10px 0 5px;
}
#gallery-controller .slider .carousel-arrow {
display: inline-block;
}
#gallery-controller .carousel-nav-wrap a {
text-indent: -999em;
line-height: 1em;
margin: -36px 0 0;
width: 72px;
height: 72px;
text-decoration: none;
position: absolute;
top: 50%;
left: 0;
}
#gallery-controller a.carousel-next {
right: 0;
left: auto;
}
#gallery-controller .carousel-nav-wrap a:before {
font: normal 64px/1em Themify;
color: #fff;
text-indent: 0;
position: absolute;
top: 50%;
left: 50%;
width: 1em;
height: 1em;
margin: -.5em 0 0 -.5em;
}
#gallery-controller a.carousel-prev:before {
content: "\e64a";
}
#gallery-controller a.carousel-next:before {
content: "\e649";
}
#gallery-controller .carousel-nav-wrap a:hover:before {
font-size: 72px;
}
/* carousel pager */
#gallery-controller .carousel-pager {
clear: both;
text-align: center;
margin: 10px 0;
}
#gallery-controller .carousel-pager a {
text-indent: -900em;
width: 12px;
height: 12px;
margin: 0 5px;
background-color: #fff;
border-radius: 10em;
cursor: pointer;
display: inline-block;
zoom:1;
*display:inline;
box-shadow: 0 0 0 2px rgba(255,255,255,0);
}
#gallery-controller .carousel-pager a.selected {
background: none;
box-shadow: 0 0 0 2px rgba(255,255,255,1);
}
/************************************************************************************
WORDPRESS POST FORMATTING
*************************************************************************************/
.sticky {}
img.alignleft, img.aligncenter, img.alignright, img.alignnone {
margin-bottom: 15px;
}
.alignleft {
float: left;
margin-right: 30px;
}
.alignright {
float: right;
margin-left: 30px;
}
.aligncenter {
text-align: center;
display: block;
margin-left: auto;
margin-right: auto;
}
.wp-caption {
text-align: center;
margin-bottom: 15px;
max-width: 100%;
}
.wp-caption-text {
font-style: italic;
font-size: 95%;
line-height: 120%;
margin: 6px 0;
}
/************************************************************************************
ATTACHMENT SINGLE VIEW
*************************************************************************************/
.attachment.single-attachment,
.single-attachment .attachment {
float: none;
margin: 0;
text-align: left;
}
/************************************************************************************
SHORTCODES
*************************************************************************************/
/* button */
a.shortcode.button.white {
color: #333 !important;
}
/************************************************************************************
GALLERY
*************************************************************************************/
#body .gallery {
margin: 0 0 20px 0;
}
/* gallery item */
#body .gallery .gallery-item {
margin: 0 8px 8px 0;
vertical-align: top;
width: auto;
float: left;
text-align: center;
position: relative;
}
/* gallery image */
#body .gallery img {
border: none;
vertical-align: middle;
}
/* gallery caption */
#body .gallery .gallery-caption {
line-height: 120%;
font-size: 90%;
text-align: center;
margin: 5px 0 0;
}
/* GALLERY COLUMN
================================================ */
/* gallery column 1 (display all in one line) */
#body .gallery-columns-1 .gallery-item {
width: auto;
}
#body .gallery-columns-1 br {
display: none !important;
}
/* gallery column 2 */
#body .gallery-columns-2 .gallery-item {
width: 49.2%;
}
/* gallery column 3 */
#body .gallery-columns-3 .gallery-item {
width: 32.3%;
}
/* gallery column 4 */
#body .gallery-columns-4 .gallery-item {
width: 23.8%;
}
/* gallery column 5 */
#body .gallery-columns-5 .gallery-item {
width: 18.8%;
}
/* gallery column 6 */
#body .gallery-columns-6 .gallery-item {
width: 15.4%;
}
/* gallery column 7 */
#body .gallery-columns-7 .gallery-item {
width: 13%;
}
/* gallery column 8 */
#body .gallery-columns-8 .gallery-item {
width: 11.18%;
}
/* gallery column 9 */
#body .gallery-columns-9 .gallery-item {
width: 9.77%;
}
/* set gallery item margin-right */
#body .gallery-columns-1 .gallery-item,
#body .gallery-columns-2 .gallery-item,
#body .gallery-columns-3 .gallery-item,
#body .gallery-columns-4 .gallery-item,
#body .gallery-columns-5 .gallery-item,
#body .gallery-columns-6 .gallery-item,
#body .gallery-columns-7 .gallery-item,
#body .gallery-columns-8 .gallery-item,
#body .gallery-columns-9 .gallery-item {
margin: 0 1.5% 1.5% 0;
}
/* clear gallery item margin-right */
#body .gallery-columns-9 .gallery-item:nth-of-type(9n),
#body .gallery-columns-8 .gallery-item:nth-of-type(8n),
#body .gallery-columns-7 .gallery-item:nth-of-type(7n),
#body .gallery-columns-6 .gallery-item:nth-of-type(6n),
#body .gallery-columns-5 .gallery-item:nth-of-type(5n),
#body .gallery-columns-4 .gallery-item:nth-of-type(4n),
#body .gallery-columns-3 .gallery-item:nth-of-type(3n),
#body .gallery-columns-2 .gallery-item:nth-of-type(2n) {
margin-right: 0;
}
/************************************************************************************
PIE CHART
*************************************************************************************/
.easyPieChart {
position: relative;
text-align: center;
margin: 0 auto;
max-width: 100%;
}
.easyPieChart img {
border-radius: 0;
vertical-align: middle;
}
.easyPieChart canvas {
position: absolute;
top: 0;
left: 0;
max-width: 100%;
}
/*
PROGRESS BAR
================================================ */
.progress-bar {
background-color: #eee;
background-color: rgba(0,0,0,.1);
margin: 25px 0 45px;
text-align: left;
color: #000;
position: relative;
height: 3px;
}
.progress-bar .progress-bar-bg {
height: 3px;
position: absolute;
}
.progress-bar .progress-bar-label {
z-index: 1;
font-style: normal;
position: absolute;
top: -25px;
text-transform: uppercase;
font-size: .9em;
}
/************************************************************************************
BUILDER
*************************************************************************************/
/* builder row */
.full_width .themify_builder_row .row_inner {
width: 978px; /* same width as .pagewidth */
max-width: 100%;
margin: auto;
}
.full_width .themify_builder_row.fullwidth .row_inner {
width: auto;
padding: 0;
}
/* prevent nav bar covering the Builder Row */
.no-header.themify_builder_active #pagewrap {
padding-top: 60px;
}
/************************************************************************************
CLEAR & ALIGNMENT
*************************************************************************************/
.clear {
clear: both;
}
.left {
float: left;
}
.right {
float: right;
}
.textleft {
text-align: left;
}
.textright {
text-align: right;
}
.textcenter {
text-align: center;
}
/* clearfix */
.clearfix:after, .widget li:after, #body:after, #footer:after, footer:after, .pagenav:after, #main-nav:after, .menu:after, .gallery:after, #content:after
{ visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix, .widget li, #body, #footer, footer, .pagenav, #main-nav, .menu, .gallery, #content
{ display: inline-block; }
/* clearfix for ie7 */
.clearfix, .widget li, #body, #footer, footer, .pagenav, #main-nav, .menu, .gallery, #content
{ display: block; zoom: 1; }
/* scrolling bg image */
.scrolling-bg-image {
width: 100% !important;
background-position: 50% 0;
position: static;
}
.fullcover.scrolling-bg-image {
background-attachment: fixed !important;
background-repeat: no-repeat !important;
-webkit-background-size: cover !important;
-moz-background-size: cover !important;
-o-background-size: cover !important;
background-size: cover !important;
}
.is-touch .fullcover.scrolling-bg-image{
background-attachment: scroll !important;
}
/************************************************************************************
ANIMATION
*************************************************************************************/
/* transitions */
#gallery-controller .carousel-nav-wrap a:before,
.slider-section .carousel-nav-wrap a:before,
.portfolio-post .post-image .carousel-nav-wrap a:before,
.portfolio-post .post-image .carousel-pager a,
.single-portfolio-expanded .close-expanded:before,
.back-top a:before {
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
transition: all .2s linear;
}
/************************************************************************************
ICON FONT
*************************************************************************************/
.post-nav .arrow:before,
.social-widget div.rss a:before {
font-family: 'FontAwesome';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
}
/* TOP NAVBAR*/
.nav-bar-top #nav-bar {
top: 0;
bottom: auto;
position: fixed;
}
.nav-bar-top.admin-bar #nav-bar {
top: 32px;
}
.nav-bar-top.home #main-nav ul {
bottom: auto;
top: 100%;
}
.nav-bar-top.home #main-nav ul ul {
bottom: auto;
top: 0;
}
.nav-bar-top.home #main-nav ul:before {
top: -8px;
bottom: auto;
border-top: none;
border-bottom: 8px solid #fff;
}
.nav-bar-top #header hgroup {
padding-top: 60px;
}
/************************************************************************************
IMAGE FILTER
*************************************************************************************/
.post-image,
.post-img,
.module-feature-image,
.slide-image {
-webkit-transition: all .5s ease-out;
transition: all .5s ease-out;
}
body .filter-grayscale img,
body .filter-hover-grayscale img:hover,
.filter-featured-only.filter-grayscale .post-image,
.filter-featured-only.filter-grayscale .post-img,
.filter-featured-only.filter-grayscale .module-feature-image,
.filter-featured-only.filter-grayscale .slide-image,
.filter-featured-only.filter-grayscale .featured-area img,
.filter-featured-only.filter-hover-grayscale .post-image:hover,
.filter-featured-only.filter-hover-grayscale .post-img:hover,
.filter-featured-only.filter-hover-grayscale .module-feature-image:hover,
.filter-featured-only.filter-hover-grayscale .slide-image:hover,
.filter-featured-only.filter-hover-grayscale .featured-area img:hover,
.filter-featured-only.filter-hover-grayscale .loops-wrapper article:hover .post-image {
-webkit-filter: grayscale(1);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
filter: gray;
filter: grayscale(1);
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
body .filter-sepia img,
body .filter-hover-sepia img:hover,
.filter-featured-only.filter-sepia .post-image,
.filter-featured-only.filter-sepia .post-img,
.filter-featured-only.filter-sepia .module-feature-image,
.filter-featured-only.filter-sepia .slide-image,
.filter-featured-only.filter-sepia .featured-area img,
.filter-featured-only.filter-hover-sepia .post-image:hover,
.filter-featured-only.filter-hover-sepia .post-img:hover,
.filter-featured-only.filter-hover-sepia .module-feature-image:hover,
.filter-featured-only.filter-hover-sepia .slide-image:hover,
.filter-featured-only.filter-hover-sepia .featured-area img:hover,
.filter-featured-only.filter-hover-sepia .loops-wrapper article:hover .post-image {
-webkit-filter: sepia(1);
-ms-filter: sepia(100%);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.5 0.5 0.4 0 0 0.5 0.3333 0.3333 0 0 0.3 0.3 0.3 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
filter: sepia(100%);
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
-webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0) scale(1.0, 1.0);
}
body .filter-blur img,
body .filter-hover-blur img:hover,
.filter-featured-only.filter-blur .post-image,
.filter-featured-only.filter-blur .post-img,
.filter-featured-only.filter-blur .module-feature-image,
.filter-featured-only.filter-blur .slide-image,
.filter-featured-only.filter-blur .featured-area img,
.filter-featured-only.filter-hover-blur .post-image:hover,
.filter-featured-only.filter-hover-blur .post-img:hover,
.filter-featured-only.filter-hover-blur .module-feature-image:hover,
.filter-featured-only.filter-hover-blur .slide-image:hover,
.filter-featured-only.filter-hover-blur .featured-area img:hover,
.filter-featured-only.filter-hover-blur .loops-wrapper article:hover .post-image {
-webkit-filter: blur(5px);
filter: blur(5px);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'blur\'><feGaussianBlur stdDeviation=\'3\'/></filter></svg>#blur");
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
-webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0) scale(1.0, 1.0);
}
.filter-all.filter-grayscale img,
.filter-all.filter-hover-grayscale img:hover,
.filter-all.filter-hover-grayscale .loops-wrapper article:hover .post-image {
-webkit-filter: grayscale(1);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
filter: gray;
filter: grayscale(1);
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
-webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0) scale(1.0, 1.0);
}
.filter-all.filter-sepia img,
.filter-all.filter-hover-sepia img:hover,
.filter-all.filter-hover-sepia .loops-wrapper article:hover .post-image {
-webkit-filter: sepia(1);
-ms-filter: sepia(100%);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.5 0.5 0.4 0 0 0.5 0.3333 0.3333 0 0 0.3 0.3 0.3 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
filter: sepia(100%);
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
-webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0) scale(1.0, 1.0);
}
.filter-all.filter-blur img,
.filter-all.filter-hover-blur img:hover,
.filter-all.filter-hover-blur .loops-wrapper article:hover img {
-webkit-filter: blur(5px);
filter: blur(5px);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'blur\'><feGaussianBlur stdDeviation=\'3\'/></filter></svg>#blur");
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
-webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0) scale(1.0, 1.0);
}
body .filter-hover-none img:hover,
.filter-featured-only.filter-hover-none .post-image:hover,
.filter-featured-only.filter-hover-none .post-img:hover,
.filter-featured-only.filter-hover-none .module-feature-image:hover,
.filter-featured-only.filter-hover-none .slide-image:hover,
.filter-all.filter-hover-none img:hover,
.filter-all.filter-hover-none .loops-wrapper article:hover img,
body.filter-all #pagewrap .format-video .post-image,
body.filter-featured-only #pagewrap .format-video .post-image {
-webkit-filter: none;
filter: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment