/*
Theme Name: REZTT
Theme URI: http://happilyevaafter.com
Author: Design by Victoria McGinley, Code by Elembee
Author URI: http://elembee.com
Description: A custom theme for REZTT, design by Victoria McGinley, code by Elembee.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: happilyevaafter
Tags:
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.
REZTT is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/
/*--------------------------------------------------------------
# Import Styles
--------------------------------------------------------------*/
@import url('css/reset.css');
@import url('css/elements.css');
@import url('css/superfish.css');
@import url('css/palm-canyon-drive.css');
@import url('css/unslider.css');
@import url('css/unslider-dots.css');
@import url('js/slick/slick.css');
/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
font-family: "freight-sans-pro",sans-serif;
font-size: 16px;
line-height: 1.3em;
letter-spacing: 0.055em;
color: #727272;
}
h1 {
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-size: 60px;
line-height: 60px;
color: #b82b88;
}
h2 {
font-family: 'Prata', serif;
font-size: 30px;
line-height: 45px;
letter-spacing: 0.05em;
color: #162f53;
}
h3 {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 20px;
line-height: 25px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #f59c9c;
}
h4 {
font-family: 'Prata', serif;
font-size: 20px;
line-height: 30px;
letter-spacing: 0.05em;
color: #162f53;
}
h5 {
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-size: 30px;
line-height: 42px;
text-transform: lowercase;
color: #a5d0ce;
}
h6 {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 14px;
line-height: 25px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #162f53;
}
p {
line-height: 1.5em;
margin-bottom: 1.3em;
}
p:last-of-type {
margin-bottom: 0;
}
blockquote {
margin: 0 1.5em;
font-style: italic;
}
/*--------------------------------------------------------------
# Links
--------------------------------------------------------------*/
a {
color: #f59c9c;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
a:hover {
color: #f59c9c;
}
/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
a.button {
cursor: pointer;
border: none;
background: #a5d0ce;
color: #ffffff;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 14px;
line-height: 1;
letter-spacing: 0.05em;
text-transform: uppercase;
padding: 10px 20px;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
a.button {
display: inline-block;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
a.button:hover {
background: #a5d0ce;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
font-family: "freight-sans-pro",sans-serif;
font-size: 16px;
line-height: 1.3em;
letter-spacing: 0.055em;
color: #727272;
box-sizing: border-box;
width: 100%;
border: none;
padding: 10px;
background: #fff3e8;
}
select {
border: 1px solid #ccc;
}
label {
display: block;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 14px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #162f53;
margin-bottom: 10px;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #000;
}
::-moz-placeholder { /* Firefox 19+ */
color: #000;
}
:-ms-input-placeholder { /* IE 10+ */
color: #000;
}
:-moz-placeholder { /* Firefox 18- */
color: #000;
}
/*--------------------------------------------------------------
# Layout
--------------------------------------------------------------*/
.wrap {
width: 90%;
max-width: 1200px;
margin: 0 auto;
}
/*--------------------------------------------------------------
## Top Bar
--------------------------------------------------------------*/
#top-bar {
padding: 15px 0;
background: #fff3e8;
}
#top-bar .wrap {
display: flex;
justify-content: space-between;
}
#top-bar ul {
margin: 0;
padding: 0;
list-style: none;
}
#top-bar #top-left-menu {
text-align: left;
}
#top-bar #social-menu {
text-align: right;
}
#top-bar ul li {
display: inline-block;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 16px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #b82b88;
}
#top-bar #top-left-menu li:after {
content: '\2022';
margin: 0 10px;
}
#top-bar #top-left-menu li:last-of-type:after {
display: none;
}
#top-bar ul li a {
color: #b82b88;
}
#top-bar ul li a:hover {
color: #fff;
}
#top-bar #social-menu li {
margin-left: 12px;
font-size: 13px;
}
#top-bar #social-menu li:first-of-type {
margin-left: 0;
}
.fontawesome-text {
display: none;
}
/*--------------------------------------------------------------
# Masthead
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Site Branding
--------------------------------------------------------------*/
#masthead {
margin: 0 auto 10px auto;
}
.site-title {
margin-bottom: 0;
}
#site-branding {
width: 100%;
max-width: 523px;
margin: -31px auto 30px auto;
}
#site-branding a {
display: block;
width: 100%;
padding-top: 31.931166%; /* 167 / 523 */
background: url(images/happily-eva-after.png) center no-repeat;
background-size: contain;
}
#site-branding span {
display: none;
}
/*--------------------------------------------------------------
## Navigation
--------------------------------------------------------------*/
#primary-menu {
display: none;
text-align: center;
}
#primary-menu li {
display: inline-block;
margin: 0 30px;
padding: 10px 0;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 16px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #a5d0ce;
}
#primary-menu li:first-of-type {
margin-left: 0;
}
#primary-menu li:last-of-type {
margin-right: 0;
}
#primary-menu li a {
color: #a5d0ce;
}
#primary-menu li a:hover,
#primary-menu li.sfHover a {
color: #b82b88;
}
#primary-menu .sub-menu,
#primary-scroll .sub-menu {
width: 155px;
padding: 20px;
background: #fff;
border: 2px solid #f5ca6a;
text-align: center;
left: 50%;
transform: translateX(-50%);
}
#primary-menu .sub-menu:before,
#primary-scroll .sub-menu:before {
content: '';
display: block;
width: 75px;
height: 10px;
background: #f5ca6a;
position: absolute;
top: -6px;
left: 50%;
transform: translateX(-50%);
}
#primary-menu .sub-menu li,
#primary-scroll .sub-menu li {
display: block;
margin: 0;
font-weight: normal;
line-height: 2em;
padding: 0;
}
#primary-menu .sub-menu li a,
#primary-scroll .sub-menu li a {
color: #f59c9c;
}
#primary-menu .sub-menu li a:hover,
#primary-scroll .sub-menu li a:hover {
color: #f8c6ce;
}
/*--------------------------------------------------------------
## Mobile Menu
--------------------------------------------------------------*/
.slicknav_menu {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 16px;
line-height: 2em;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #a5d0ce;
text-align: center;
}
.slicknav_menu a {
color: #a5d0ce;
}
.slicknav_menu .sub-menu a {
color: #f59c9c;
}
/*--------------------------------------------------------------
## Scroll Bar
--------------------------------------------------------------*/
#scroll-bar {
padding: 30px 0;
background: #fff3e8;
position: fixed;
width: 100%;
z-index: 7000;
display: none;
}
#scroll-bar .wrap,
#scroll-right {
display: flex;
justify-content: flex-start;
align-items: center;
}
#scroll-bar ul {
margin: 0;
padding: 0;
list-style: none;
}
#scroll-bar li {
display: inline-block;
margin: 0 0 0 35px;
padding: 10px 0;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 13px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #a5d0ce;
}
#scroll-bar li.hide-scroll {
display: none;
}
#scroll-bar a {
color: #162f53;
}
#scroll-bar a:hover,
#scroll-bar li.sfHover a {
color: #b82b88;
}
#scroll-title {
font-family: 'Prata', serif;
font-size: 20px;
line-height: 20px;
letter-spacing: 0.25em;
color: #162f53;
text-transform: uppercase;
}
#scroll-title a {
color: #162f53;
}
#scroll-right {
margin-left: auto;
}
#scroll-bar #scroll-right li {
margin-left: 12px;
font-weight: normal;
}
#scroll-bar ul#top-left-scroll {
margin-right: 10px;
}
#top-left-scroll li:first-of-type:after {
content: '\2022';
margin: 0 0 0 10px;
color: #162f53;
}
/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#site-footer {
background: #fff3e8;
padding: 70px 0 50px 0;
position: relative;
}
#footer-badge {
display: block;
position: absolute;
top: -85px;
left: 50%;
transform: translateX(-50%);
max-width: 232px;
height: auto;
}
#site-footer .wrap {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: stretch;
}
#footer-navigation {
width: 50%;
border-right: 4px solid #f5ca6a;
padding-right: 80px;
}
#footer-menu {
-moz-column-count: 4;
-webkit-column-count: 4;
column-count: 4;
text-align: center;
}
#footer-menu li {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: 500;
font-size: 15px;
line-height: 1.66667em;
letter-spacing: 0.1em;
text-transform: uppercase;
}
#footer-menu li a {
color: #aaaaaa;
}
#footer-menu li a:hover {
text-decoration: underline;
}
#subscribe {
width: 50%;
padding-left: 45px;
}
#subscribe .widget-title {
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
text-transform: lowercase;
color: #b82b88;
letter-spacing: normal;
}
#subscribe .textwidget {
display: flex;
justify-content: space-between;
}
#subscribe .textwidget #subscribe-info {
width: 42.342342%; /* 235/555 */
font-family: "proxima-nova-extra-condensed",sans-serif;
font-size: 15px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #aaa;
}
#subscribe .textwidget #mc_embed_signup {
width: 50.45045%; /* 280/555 */
}
#subscribe .textwidget #mc_embed_signup #mce-EMAIL {
background: #fff;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-size: 15px;
letter-spacing: 0.05em;
color: #aaa;
}
#subscribe .textwidget #mc_embed_signup #mc-embedded-subscribe {
padding: 0 0 10px 0;
background: none;
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
text-transform: lowercase;
color: #b82b88;
letter-spacing: normal;
float: right;
margin-top: -10px;
margin-bottom: -56px;
}
#site-credits {
padding: 15px 0;
list-style: none;
text-align: center;
}
#site-credits li {
display: inline-block;
margin-right: 10px;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-size: 10px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #f8c6ce;
}
#site-credits li:last-of-type {
margin-right: 0;
}
#site-credits li a {
color: #f8c6ce;
}
#site-credits li a:hover {
text-decoration: underline;
}
/*--------------------------------------------------------------
# Home
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Slider + Feature Blocks
--------------------------------------------------------------*/
#intro {
background: url(images/home-feature-bg.png) top center;
padding: 40px 0;
margin-bottom: 40px;
}
#intro .wrap {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#intro #slider-container {
width: 71.6666667%; /* 860/1200 */
}
#intro #slider {
position: relative;
border: 10px solid #fff;
}
#intro #slider ul {
margin: 0;
padding: 0;
list-style: none;
}
#intro #slider .slide {
position: relative;
}
#intro #slider .slide .featured-image img {
display: block;
}
#intro #slider .slide .featured-image:before {
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, .35);
opacity: 0;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
#intro #slider .slide:hover .featured-image:before {
opacity: 1;
}
#intro #slider .slide .slide-content-container {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
}
#intro #slider .slide .slide-content {
width: 90%;
max-width: 550px;
margin: auto;
text-align: center;
}
#intro #slider .slide .slide-content a {
color: #fff;
}
#intro #slider .slide .slide-content .slide-post-category {
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-weight: normal;
font-size: 35px;
line-height: 45px;
color: #fff;
text-transform: lowercase;
margin-bottom: 10px;
}
#intro #slider .slide .slide-content .slide-title {
font-size: 45px;
line-height: 1.2em;
color: #fff;
margin-bottom: 15px;
}
#intro #slider .slide .slide-content .slide-cta {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-size: 20px;
font-weight: normal;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #fff;
}
#intro #featured-category-posts {
width: 26.25%; /* 315/1200 */
}
#intro .featured-category-post {
position: relative;
border: 10px solid #fff;
margin-bottom: 10px;
background: #fff;
}
#intro .featured-category-post:last-of-type {
margin-bottom: 0;
}
#intro .featured-category-post .featured-image img {
display: block;
-webkit-transition: opacity .3s ease-in-out;
-moz-transition: opacity .3s ease-in-out;
-ms-transition: opacity .3s ease-in-out;
-o-transition: opacity .3s ease-in-out;
transition: opacity .3s ease-in-out;
}
#intro .featured-category-post:hover .featured-image img {
opacity: .5;
}
#intro .featured-category-post .featured-category-post-content-container {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
display: flex;
}
#intro .featured-category-post .featured-category-post-content {
width: 90%;
max-width: 190px;
padding: 0 20px 20px 20px;
text-align: center;
margin: auto;
background: rgba(255, 255, 255, .9);
}
#intro .featured-category-post .featured-category {
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-weight: normal;
font-size: 30px;
line-height: 30px;
color: #b82b88;
text-transform: lowercase;
margin-bottom: 10px;
margin-top: -10px;
}
#intro .featured-category-post .featured-category a {
color: #b82b88;
}
#intro .featured-category-post .featured-category-title {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-size: 20px;
font-weight: bold;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #f59c9c;
}
#intro .featured-category-post .featured-category-title a {
color: #f59c9c;
}
/*--------------------------------------------------------------
## Post Grid
--------------------------------------------------------------*/
.post-grid-container {
display: flex;
justify-content: space-between;
}
.post-grid-container .post-grid {
width: 72.5%; /* 870/1200 */
}
.post-grid .post {
display: flex;
justify-content: space-between;
margin-bottom: 25px;
}
.post-grid .post .entry-content-container {
order: 2;
width: 94.252874%; /* 820/870 */
border: 2px solid #ebebeb;
display: flex;
justify-content: space-between;
}
.post-grid .post .featured-image {
width: 34.756098%; /* 285/820*/
}
.post-grid .post .featured-image img {
display: block;
}
.post-grid .post .entry-content {
width: 65.243902%; /* 535/820*/
padding: 15px 25px;
}
.posted-in {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-size: 14px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #f59c9c;
}
.comments-link {
float: right;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-size: 14px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #f5ca6a;
}
.comments-link a {
color: #f5ca6a;
}
.comments-link a:hover {
color: #f59c9c;
}
.post-grid .post .entry-title {
font-family: 'Prata', serif;
font-size: 20px;
line-height: 1.5em;
letter-spacing: 0.05em;
color: #162f53;
text-transform: none;
margin-top: 5px;
margin-bottom: 10px;
}
.post-grid .post p {
margin-bottom: 15px;
}
a.button.read-more {
background: url(images/read-more.png) center;
color: #162f53;
font-size: 16px;
}
a.button.read-more:hover {
background: url(images/read-more.png) center;
color: #b82b88;
}
.post-grid .post .share {
order: 1;
width: 30px;
margin: 0 15px 0 0;
padding: 0;
list-style: none;
text-align: center;
}
.post-grid .post .share ul {
margin: 0;
padding: 0;
list-style: none;
}
.post-grid .post .share .expand-share > span {
display: block;
padding: 5px 10px;
background: #f8c6ce;
color: #fff;
font-size: 18px;
cursor: pointer;
}
.post-grid .post .share-submenu {
font-size: 15px;
display: none;
}
.post-grid .post .expand-share.share-active .share-submenu {
display: block;
}
.post-grid .post .share-submenu li {
margin-top: 15px;
}
.post-grid .post .share-submenu a {
color: #f8c6ce;
}
.post-grid .post .share-submenu a:hover {
color: #f5ca6a;
}
.post-grid-container #primary,
.post-grid-container #secondary {
width: 25%; /* 300/1200 */
}
/*--------------------------------------------------------------
## Primary Sidebar
--------------------------------------------------------------*/
#primary .widget {
margin-bottom: 25px;
}
#primary #menu-social {
text-align: center;
}
#primary #menu-social li {
display: inline-block;
margin: 0 6px;
}
#primary #menu-social li a {
display: block;
color: #fff;
background: #f8c6ce;
font-size: 14px;
padding: 6px 0;
width: 32px;
text-align: center;
border-radius: 50%;
}
#primary #menu-social li a:hover {
background: #b82b88;
}
#primary .menu-block {
padding: 25px 10px 15px 10px;
background: #a5d0ce;
text-align: center;
}
#primary .menu-block .widget-title {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 20px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #fff;
margin-bottom: 15px;
}
#primary .menu-block ul {
text-align: center;
}
#primary .menu-block ul li {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 17px;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #fff;
display: inline-block;
}
#primary .menu-block ul li a {
color: #fff;
display: inline-block;
padding-bottom: 2px;
border-bottom: 5px solid transparent;
}
#primary .menu-block ul li a:hover {
border-color: #fff;
}
#primary .menu-block #menu-subscribe li:after {
content: '|';
margin: 0 10px;
display: inline-block;
}
#primary .menu-block #menu-subscribe li:last-of-type:after {
display: none;
}
/*--------------------------------------------------------------
## Secondary Sidebar
--------------------------------------------------------------*/
#secondary .widget {
margin-bottom: 75px;
position: relative;
}
#secondary .widget:before {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%,-50%);
font-size: 28px;
border-radius: 50%;
width: 48px;
padding: 10px 0;
background: #f5ca6a;
color: #fff;
text-align: center;
}
#secondary .widget.advice {
padding: 55px 25px 25px 25px;
background: url(images/zig-zag.jpg) center top repeat;
text-align: center;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 20px;
line-height: 30px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #162f53;
}
#secondary .widget.advice:before {
content: '?';
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-weight: normal;
font-size: 30px;
padding: 9px 0;
line-height: 30px;
}
#secondary .widget.advice .widget-title {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 50px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #b82b88;
margin-bottom: 40px;
}
#secondary .widget.advice a {
display: block;
padding: 10px 5px 5px 5px;
background: #a5d0ce;
color: #fff;
font-weight: normal;
font-size: 17px;
line-height: normal;
}
#secondary .widget.advice a:hover {
background: #b82b88;
}
#secondary .widget.shop {
padding: 25px;
border: 1px solid #fff3e8;
text-align: center;
}
#secondary .widget.shop p:last-of-type a {
display: block;
padding: 10px 5px 5px 5px;
background: #f8c6ce;
color: #fff;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 17px;
letter-spacing: 0.1em;
text-transform: uppercase;
text-align: center;
}
#secondary .widget.shop p:last-of-type a:hover {
background: #f5ca6a;
}
/*--------------------------------------------------------------
## Shop Interstitial
--------------------------------------------------------------*/
#shop {
background: #fff3e8;
padding-bottom: 30px;
border-top: 38px solid #fff;
}
#shop h1 {
text-align: center;
margin-top: -38px;
margin-bottom: 45px;
}
#shop .wrap {
display: flex;
justify-content: space-between;
align-items:flex-start;
padding: 0 50px;
}
#shop .widget {
position: relative;
}
#shop .widget-must-have {
width: 26.363636%; /* 290/1100 */
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-weight: normal;
font-size: 14px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #162f53;
text-align: center;
}
#shop .widget-must-have h3 {
text-align: center;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 14px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #162f53;
margin-top: 15px;
}
#shop .widget-must-have .widget-title {
position: absolute;
width: 40px;
top: 0;
left: 15px;
background: #f5ca6a;
color: #fff;
font-size: 14px;
line-height: 15px;
font-weight: normal;
padding: 5px 0 10px 0;
margin-top: 0;
}
#shop .widget-must-have a {
color: #162f53;
}
#shop .widget-must-have a:hover {
text-decoration: underline;
}
#shop .widget-carousel {
width: 72.727272%; /* 800/1100 */
}
#shop .widget-carousel .textwidget {
background: #fff;
padding: 20px 0;
text-align: center;
}
#shop .widget-carousel > a {
display: block;
position: absolute;
bottom: 0;
right: 25px;
padding: 5px 0;
width: 90%;
max-width: 140px;
text-align: center;
background: #a5d0ce;
color: #fff;
transform: translateY(50%);
}
#shop .widget-carousel > a h3 {
color: #fff;
font-size: 14px;
line-height: 1em;
font-weight: normal;
}
#shop .widget-carousel > a:hover {
background: #162f53;
}
/*--------------------------------------------------------------
## Featured Posts
--------------------------------------------------------------*/
#featured-posts {
padding: 70px 0 100px 0;
background: url(images/zig-zag.jpg) center repeat;
}
.featured-post {
display: flex;
justify-content: space-between;
margin-bottom: 30px;
}
.featured-post:last-of-type {
margin-bottom: 0;
}
.featured-post .entry-content-container {
order: 2;
width: 95.833333%; /* 1150/1200 */
display: flex;
justify-content: space-between;
align-items: stretch;
}
.featured-post.image-right .entry-content-container {
order: 1;
}
.featured-post .featured-image {
width: 45.652174%; /* 525/1150 */
position: relative;
}
.featured-post.image-right .featured-image {
order: 2;
}
.featured-post .featured-image .category {
display: block;
position: absolute;
top: -8px;
left: 50%;
transform: translateX(-50%);
text-align: center;
padding: 5px 40px 10px 40px;
background: #162f53;
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-weight: normal;
font-size: 30px;
line-height: 30px;
color: #a5d0ce;
text-transform: lowercase;
}
.featured-post .featured-image img,
.featured-post .featured-image a {
display: block;
}
.featured-post .entry-content {
width: 53.043478%; /* 610/1150 */
padding: 20px 50px 20px 35px;
background: rgba(255, 255, 255, .8);
}
.featured-post.image-right .entry-content {
order: 1;
padding: 20px 35px 20px 50px;
}
.featured-post .comments-link {
float: none;
margin-bottom: 10px;
color: #f8c6ce;
}
.featured-post .comments-link a {
color: #f8c6ce;
}
.featured-post .entry-title {
margin-bottom: 20px;
}
.featured-post p {
font-size: 18px;
}
.featured-post .read-more {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 16px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #b82b88;
display: block;
margin-top: 20px;
}
.featured-post .read-more:hover {
color: #f8c6ce;
}
.featured-post .shop-the-post {
margin-top: 30px;
padding-top: 45px;
border-top: 2px solid #a5d0ce;
}
.featured-post .share {
order: 1;
width: 30px;
margin: 0 15px 0 0;
padding: 0;
list-style: none;
text-align: center;
}
.featured-post.image-right .share {
margin: 0 0 0 15px;
}
.featured-post.image-right .share {
order: 2;
}
.featured-post .share ul {
margin: 0;
padding: 0;
list-style: none;
}
.featured-post .share .expand-share > span {
display: block;
padding: 5px 10px;
background: #f8c6ce;
color: #fff;
font-size: 18px;
cursor: pointer;
}
.featured-post .share-submenu {
font-size: 15px;
display: none;
}
.featured-post .expand-share.share-active .share-submenu {
display: block;
}
.featured-post .share-submenu li {
margin-top: 15px;
}
.featured-post .share-submenu a {
color: #f8c6ce;
}
.featured-post .share-submenu a:hover {
color: #f5ca6a;
}
/*--------------------------------------------------------------
## Instagram
--------------------------------------------------------------*/
#instagram-home {
background: #fff3e8;
}
#instagram-home h1 {
text-align: center;
transform: translateY(-50%);
}
.instagram-grid {
display: flex;
justify-content: space-between;
padding-bottom: 50px;
width: 90%;
max-width: 1100px;
margin: 0 auto;
}
#site-footer .instagram-grid {
width: 100%;
max-width: 1200px;
}
.instagram-grid .widget {
width: 24.545454%; /* 270/1100 */
border: 10px solid #fff;
}
#follow-instagram-button {
display: block;
width: 90%;
max-width: 180px;
text-align: center;
margin: 0 auto;
padding: 10px;
background: #162f53;
color: #a5d0ce;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 14px;
letter-spacing: 0.05em;
text-transform: uppercase;
transform: translateY(50%);
}
#follow-instagram-button i {
margin-right: 5px;
}
/*--------------------------------------------------------------
## Highlight Post
--------------------------------------------------------------*/
.highlight-post {
max-width: 1100px;
padding: 60px 0 95px 0;
text-align: center;
}
.highlight-post .category {
display: block;
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-weight: normal;
font-size: 30px;
line-height: 30px;
color: #b82b88;
text-transform: lowercase;
position: relative;
z-index: 2;
margin-bottom: 10px;
}
.highlight-post .category:before {
content: '';
display: block;
width: 189px;
height: 25px;
background: url(images/cream-dot.png) center no-repeat;
margin: -16px auto -14px auto;
}
.highlight-post .entry-title {
font-size: 40px;
margin-bottom: 15px;
}
.highlight-post a.button.read-more {
display: inline-block;
padding: 10px 20px;
background: #a5d0ce;
color: #fff;
margin-top: 20px;
font-size: 16px;
}
.highlight-post a.button.read-more:hover {
background: #f5ca6a;
}
/*--------------------------------------------------------------
## Browse Around
--------------------------------------------------------------*/
#browse {
background: #fff3e8;
padding: 40px 0;
margin-top: 105px;
margin-bottom: 75px;
position: relative;
}
#browse.browse-home {
background: #fff url(images/diamond.png) center top repeat;
padding: 45px 0 125px 0;
margin-top: 0;
margin-bottom: 0;
}
#browse h1 {
position: absolute;
top: -45px;
left: 50%;
transform: translateX(-50%);
}
#browse .wrap {
display: flex;
justify-content: space-between;
}
#browse .wrap .widget {
width: 32.916667%; /* 395/1200 */
border: 10px solid #fff;
position: relative;
}
#browse.browse-home .wrap .widget {
border-color: #fff3e8;
}
#browse .wrap .widget .simple-image {
width: 100%;
padding-bottom: 56%; /* 210/375 */
position: relative;
margin: 0;
}
#browse .wrap .widget .simple-image img {
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
#browse .wrap .widget .simple-image a,
#browse .wrap .widget .simple-image img {
display: block;
}
#browse .wrap .widget .simple-image a:before {
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, .6);
z-index: 2;
opacity: 0;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
#browse .wrap .widget:hover .simple-image a:before {
opacity: 1;
}
#browse .wrap .widget p:nth-of-type(2n) {
position: absolute;
top: 0;
height: 50%;
width: 100%;
text-align: center;
display: flex;
justify-content: center;
align-items: flex-end;
margin: 0;
padding-bottom: 5px;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 16px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #fff;
z-index: 3;
}
#browse .wrap .widget p.more {
position: absolute;
top: 50%;
height: 50%;
margin: 0;
width: 100%;
text-align: center;
padding-top: 5px;
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-weight: normal;
font-size: 30px;
line-height: 30px;
color: #fff;
z-index: 3;
}
#browse .wrap .widget p.more a {
color: #fff;
}
/*--------------------------------------------------------------
# Archive
--------------------------------------------------------------*/
.archive #masthead {
margin-bottom: 60px;
}
.archive.post-type-archive-travel #masthead {
margin-bottom: 10px;
}
#archive {
margin-bottom: 150px;
}
.archive-header {
margin-bottom: 30px;
}
.archive-header h1 {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 20px;
line-height: 40px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #b82b88;
}
.archive-header h1 span {
font-family: 'PalmCanyonDrive', serif;
letter-spacing: normal;
font-weight: normal;
text-transform: none;
font-size: 40px;
line-height: 40px;
}
#archive #primary {
margin-top: -57px;
}
.older-posts {
text-align: center;
margin-top: 40px;
}
.older-posts a {
display: inline-block;
background: #a5d0ce;
color: #ffffff;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 20px;
line-height: 1;
letter-spacing: 0.05em;
text-transform: uppercase;
padding: 30px 50px;
}
.older-posts a:hover {
background: #b92b88;
}
/*--------------------------------------------------------------
# Single Post
--------------------------------------------------------------*/
#single-post {
margin-top: 50px;
}
#single-post #main {
display: flex;
justify-content: space-between;
}
#single-post #main .post-container {
width: 60%; /* 720/1200 */
}
#single-post #main #sidebar {
width: 25%; /* 300/1200 */
}
#single-post #main #sidebar #primary {
margin-bottom: 50px;
}
.post .entry-title {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 25px;
line-height: 1.2em;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #162f53;
max-width: 600px;
}
.post .entry-content h1 {
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: 1.4em;
color: #a5d0ce;
}
.post .entry-content h2 {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 20px;
line-height: 1.25em;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #162f53;
}
.post .entry-content h6 {
font-family: 'Prata', serif;
font-style: italic;
font-weight: normal;
font-size: 13px;
line-height: 1.923em;
letter-spacing: 0.05em;
color: #727272;
text-transform: none;
margin-top: 1.3em;
}
.post .entry-content ul {
margin: 0 0 1.5em 0;
padding: 0;
list-style: none;
}
.post .entry-content ul li {
padding-left: 20px;
line-height: 1.875em;
}
.post .entry-content ul li:before {
content: '\2022';
color: #f59c9c;
font-size: 125%;
margin-left: -20px;
padding-right: 10px;
}
#single-post .entry-header {
display: flex;
justify-content: space-between;
margin-bottom: 25px;
}
#single-post .post-date {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 14px;
line-height: 1.25em;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #fff;
padding: 10px 10px 10px 40px;
background: #f59c9c;
margin-left: -50px;
display: flex;
justify-content: space-between;
align-items: center;
margin-right: 15px;
}
#single-post .post-date:before,
#single-post .post-date:after {
content: '';
display: block;
width: 1px;
height: 100%;
}
#single-post .entry-header-container {
width: 100%;
}
#single-post .entry-footer {
border-top: 4px solid #a5d0ce;
margin-top: 55px;
margin-bottom: 55px;
}
#single-post #share-title {
width: 90%;
max-width: 200px;
margin: -2px auto 0 auto;
padding: 0 0 10px 0;
background: #a5d0ce;
text-align: center;
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
color: #fff;
letter-spacing: normal;
text-transform: lowercase;
transform: translateY(-50%);
}
#single-post .share {
text-align: center;
}
#single-post .share li {
display: inline-block;
margin: 0 25px;
}
#single-post .share li a {
display: block;
width: 54px;
padding: 12px 0;
border-radius: 50%;
text-align: center;
font-size: 30px;
background: #f5ca6a;
color: #fff;
}
#single-post .share li a:hover {
background: #f59c9c;
}
/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
#respond {
border-top: 4px solid #a5d0ce;
margin-bottom: 95px;
}
#reply-title {
width: 90%;
max-width: 200px;
margin: -2px auto 35px auto;
padding: 0 0 10px 0;
background: #a5d0ce;
text-align: center;
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
color: #fff;
letter-spacing: normal;
text-transform: lowercase;
transform: translateY(-50%);
}
#commentform {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#comment-form-right {
order: 2;
width: 53.472222%; /* 385/720 */
}
#comment-form-right textarea {
height: 230px
}
#comment-form-left {
order: 1;
width: 40.277778%; /* 290/720 */
}
.comment-subscription-form {
order: 3;
width: 100%;
margin-top: 20px;
}
.form-submit {
order: 4;
width: 100%;
text-align: right;
margin-top: 20px;
}
.form-submit input[type="submit"] {
padding: 0;
background: none;
font-size: 20px;
color: #f59c9c;
}
#comments-section {
border-top: 4px solid #a5d0ce;
margin-bottom: 30px;
}
.comments-title {
width: 90%;
max-width: 200px;
margin: -2px auto 30px auto;
padding: 0 0 10px 0;
background: #a5d0ce;
text-align: center;
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
color: #fff;
letter-spacing: normal;
text-transform: lowercase;
transform: translateY(-50%);
}
#cancel-comment-reply-link {
display: block;
text-align: center;
color: #fff;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 14px;
line-height: 1.25em;
letter-spacing: 0.1em;
text-transform: uppercase;
}
.comment-list,
.comment-list ul {
margin: 0;
padding: 0;
list-style: none;
}
.comment-list > li {
padding-bottom: 25px;
margin-bottom: 25px;
border-bottom: 2px solid #fff3e8;
}
.comment-list > li:last-of-type {
padding-bottom: 0;
margin-bottom: 0;
border-bottom: none;
}
.comment-list .children {
margin-left: 50px;
}
.comment-list .children li {
margin-top: 25px;
padding: 20px;
background: #fff3e8;
border-radius: 7px;
position: relative;
}
.comment-list .children li:before {
content: '';
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 0 12px 10px 12px;
border-color: transparent transparent #fff3e8 transparent;
position: absolute;
top: -10px;
left: 20px;
}
.comment-author {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 14px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #162f53;
margin-bottom: 10px;
}
.comment-author a {
color: #162f53;
}
.comment-text {
margin-bottom: 10px;
}
.comment-meta {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 14px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #f59c9c;
}
.comment-meta a {
color: #f59c9c;
}
.comment-date {
margin-right: 10px;
}
/*--------------------------------------------------------------
## Next Post
--------------------------------------------------------------*/
.next-post-block {
padding: 60px 0 125px 0;
background: url(images/zig-zag.jpg) top center repeat;
}
.next-post-block .wrap {
max-width: 1100px;
text-align: center;
}
.next-post {
position: relative;
}
.next-post img,
.next-post a {
display: block;
}
.next-post img {
margin: 0 auto;
}
.next-post-info {
width: 90%;
max-width: 475px;
padding: 30px 20px 60px 20px;
text-align: center;
background: rgba(255, 255, 255, .9);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.next-post-info:before {
content: '';
display: block;
width: 189px;
height: 25px;
background: url(images/cream-dot.png) center no-repeat;
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%,-50%);
}
.next-post-subtitle {
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
color: #b82b88;
letter-spacing: normal;
text-transform: lowercase;
margin-bottom: 20px;
}
.next-post-info h2 {
font-size: 40px;
line-height: 50px;
max-width: 350px;
margin: 0 auto;
}
.next-post-cta {
width: 115px;
padding: 5px;
text-align: center;
background: #a5d0ce;
color: #fff;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 14px;
letter-spacing: 0.1em;
text-transform: uppercase;
position: absolute;
bottom: 0;
left: 50%;
transform: translate(-50%,50%);
}
/*--------------------------------------------------------------
## Gallery
--------------------------------------------------------------*/
#post-gallery {
margin-bottom: 10px;
}
#post-gallery img {
height: 535px;
width: auto;
margin-right: 5px;
}
#post-gallery-captions {
padding: 10px 0 25px 0;
border-top: 4px solid #fff3e8;
border-bottom: 4px solid #fff3e8;
margin-bottom: 40px;
}
#post-gallery-captions .slide-number {
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
color: #f59c9c;
letter-spacing: normal;
text-transform: lowercase;
margin-bottom: 15px;
margin-left: 2px;
}
#post-gallery-captions .slide-caption {
font-size: 17px;
line-height: 25px;
}
#gallery-nav {
text-align: right;
position: relative;
z-index: 2;
}
#gallery-nav button {
width: 28px;
padding: 3px 0;
font-size: 20px;
color: #162f53;
background: #fff3e8;
border-radius: 50%;
margin-left: 15px;
outline: none;
transform: translateY(50%);
margin-bottom: -2px;
}
.gallery-content {
font-family: 'Prata', serif;
font-size: 17px;
line-height: 30px;
letter-spacing: 0.05em;
color: #162f53;
}
.gallery-content p:first-of-type::first-letter {
font-size: 35px;
}
/*--------------------------------------------------------------
# Info Page
--------------------------------------------------------------*/
#info-page {
display: flex;
justify-content: space-between;
margin-top: 50px;
margin-bottom: 120px;
}
#info-page #main {
width: 60%; /* 720/1200 */
}
#info-page #sidebar {
width: 25%; /* 300/1200 */
}
#info-page #sidebar #primary {
margin-bottom: 50px;
}
#info-page .entry-title {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 25px;
line-height: 1.2em;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #162f53;
}
/*--------------------------------------------------------------
# Shop Page
--------------------------------------------------------------*/
#shop-page {
padding: 45px 0 125px 0;
background: url(images/zig-zag.jpg) center top repeat;
}
#shop-page #main {
padding: 45px 5%;
background: #fff;
}
#shop-page .shop-header {
display: flex;
justify-content: flex-start;
margin-bottom: 50px;
}
#shop-page .shop-header h1 {
padding: 85px 10px 55px 10px;
background: #a5d0ce;
color: #fff;
margin: -90px 40px 0 0;
}
.shop-tabs h3 {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 17px;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #162f53;
margin-bottom: 20px;
}
.shop-tabs li {
display: inline-block;
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 17px;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #f59c9c;
margin-right: 40px;
cursor: pointer;
}
#tabs .content {
position: relative;
max-width: 900px;
margin: 0 auto;
}
#tabs .content section {
opacity: 0;
position: absolute;
top: 0;
left: 0;
}
#tabs .content section.content-current {
opacity: 1;
position: static;
}
#tabs .bo-box {
background: #fff !important;
border: 1px solid #fff !important;
}
#tabs .bo-con:before,
#tabs .bo-con:after {
display: none !important;
}
/*--------------------------------------------------------------
# Travel Guide
--------------------------------------------------------------*/
#archive-travel {
padding: 45px 0 125px 0;
background: url(images/zig-zag.jpg) center top repeat;
}
#archive-travel #main {
padding: 45px 2.9% 20px 2.9%;
background: #fff;
}
#archive-travel .page-header {
display: flex;
justify-content: flex-start;
max-width: 1080px;
margin: 0 auto 50px auto;
}
#archive-travel .page-header h1 {
padding: 85px 10px 55px 10px;
background: #a5d0ce;
color: #fff;
margin: -90px 40px 0 0;
}
#archive-travel .page-header h2 {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: bold;
font-size: 17px;
line-height: normal;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #162f53;
margin-bottom: 20px;
}
#archive-travel .page-header h3 {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 17px;
line-height: normal;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #f59c9c;
}
#travel-grid {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#travel-grid .travel-thumb {
width: 48.214286%; /* 540/1120 */
margin-bottom: 35px;
position: relative;
}
#travel-grid .gap {
width: 48.214286%; /* 540/1120 */
}
#travel-grid .travel-thumb img {
display: block;
}
#travel-grid h2 {
font-family: 'PalmCanyonDrive', serif;
font-size: 50px;
line-height: normal;
font-weight: normal;
color: #fff;
letter-spacing: normal;
position: absolute;
padding: 20px;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
/*--------------------------------------------------------------
## Travel Guide Single
--------------------------------------------------------------*/
#single-travel {
padding: 45px 0 125px 0;
background: url(images/zig-zag.jpg) center top repeat;
}
#single-travel #main {
padding: 60px 2.9% 35px 2.9%;
background: #fff;
}
#single-travel .page-header {
display: flex;
justify-content: space-between;
max-width: 1080px;
margin: 0 auto 50px auto;
}
#single-travel .page-header h1 {
padding: 85px 10px 55px 10px;
background: #a5d0ce;
color: #fff;
margin: -105px 40px 0 0;
}
#single-travel .page-header a {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 17px;
line-height: normal;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #f59c9c;
}
#single-travel .page-header a:hover {
text-decoration: underline;
}
#single-travel .featured-image {
position: relative;
margin-bottom: 60px;
}
#single-travel .featured-image img {
display: block;
}
#single-travel .entry-title {
font-family: 'PalmCanyonDrive', serif;
font-size: 50px;
line-height: normal;
font-weight: normal;
color: #fff;
letter-spacing: normal;
position: absolute;
padding: 20px;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
#single-travel .travel-cta {
background: #f5ca6a;
padding: 20px;
border-radius: 6px;
font-size: 16px;
position: absolute;
bottom: 0;
right: 35px;
transform: translateY(50%);
}
#single-travel .travel-cta i {
margin-right: 10px;
}
#single-travel .travel-cta:hover {
background: #f59c9c;
}
#single-travel .entry-content h3 {
font-weight: normal;
}
#single-travel .entry-content ul {
margin: 0 0 1.5em 0;
padding: 0;
list-style: none;
}
#single-travel .entry-content li {
font-size: 17px;
color: #727272;
margin-bottom: 1em;
}
#single-travel .entry-content li:last-of-type {
margin-bottom: 0;
}
#single-travel .entry-content li a {
color: #727272;
}
/*--------------------------------------------------------------
# About Page
--------------------------------------------------------------*/
#about-page {
margin-top: 50px;
max-width: 1150px;
}
#about-page #main {
display: flex;
justify-content: space-between;
}
#about-page #main .featured-image {
width: 41.304348%; /* 475/1150 */
position: relative;
}
#about-page #main .featured-image img {
display: block;
}
#about-page #connect {
width: 90%;
max-width: 400px;
padding: 20px;
text-align: center;
background: rgba(248, 198, 206, .95);
border-radius: 7px;
margin: 0 auto;
transform: translateY(-50%);
}
#about-page #connect h2 {
font-size: 17px;
line-height: normal;
margin-bottom: 20px;
}
#about-page #connect #connect-menu {
margin: 0 0 20px 0;
padding: 0;
list-style: none;
}
#about-page #connect #connect-menu li {
display: inline-block;
margin: 0 10px;
}
#about-page #connect #connect-menu li a {
display: block;
width: 30px;
padding: 5px 0;
text-align: center;
font-size: 14px;
color: #fff;
background: #b82b88;
border-radius: 50%;
}
#about-page #connect .email {
font-family: "proxima-nova-extra-condensed",sans-serif;
font-weight: normal;
font-size: 17px;
line-height: normal;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #b82b88;
}
#about-page #main .entry-content {
width: 55.217391%; /* 635/1150 */
}
#about-page #main .entry-content h1 {
font-size: 30px;
color: #a5d0ce;
margin-bottom: 5px;
}
#about-page #main .entry-content h2 {
font-family: 'PalmCanyonDrive', serif;
font-size: 30px;
line-height: normal;
font-weight: normal;
color: #f59c9c;
letter-spacing: normal;
}
#more-about {
margin-bottom: 135px;
border-top: 3px solid #162f53;
}
#more-about > h2 {
font-size: 35px;
text-transform: uppercase;
display: inline-block;
padding-right: 40px;
background: #fff;
transform: translateY(-50%);
}
#about-grid {
display: flex;
justify-content: space-between;
}
#about-grid .about-column {
width: 48.695652%; /* 560/1150 */
}
#about-grid #about-right {
margin-top: 175px;
}
#about-grid .about-section {
border: 8px solid #a5d0ce;
position: relative;
margin-bottom: 35px;
}
#about-grid #about-left .about-section:nth-of-type(2n) {
border-color: #f59c9c;
}
#about-grid #about-left .about-section:last-of-type {
border-color: #b82b88;
}
#about-grid #about-right .about-section:first-of-type {
border-color: #f8c6ce;
}
#about-grid #about-right .about-section:nth-of-type(2n) {
border-color: #f5ca6a;
}
#about-grid .about-section img {
display: block;
}
#about-grid .about-section .about-section-info {
padding: 30px;
background: rgba(255, 255, 255, .9);
position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: #000000;
max-height: 120px;
overflow: hidden;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
#about-grid .about-section:hover .about-section-info {
max-height: 100%;
}
#about-grid .about-section .about-section-info h3 {
font-family: 'PalmCanyonDrive', serif;
font-size: 50px;
line-height: normal;
font-weight: normal;
text-transform: none;
color: #162f53;
letter-spacing: normal;
margin-bottom: 30px;
}
#about-grid .about-section .about-section-info a {
color: #000;
text-decoration: underline;
}
#about-grid .press-section {
padding: 30px;
background: #fff3e8;
display: flex;
flex-wrap: wrap;
align-content: flex-end;
min-height: 545px;
}
#about-grid .press-section h2 {
font-family: 'PalmCanyonDrive', serif;
font-size: 50px;
line-height: normal;
font-weight: normal;
text-transform: none;
color: #b82b88;
letter-spacing: normal;
margin-top: 20px;
width: 100%;
}
#about-grid .press-section ul {
margin: 0;
padding: 0;
list-style: none;
width: 100%;
font-size: 17px;
line-height: 25px;
}
#about-grid .press-section ul a {
color: #727272;
}
/*--------------------------------------------------------------
# Media Queries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Desktop
--------------------------------------------------------------*/
@media screen and (min-width: 768px) {
#primary-menu {
display: block;
}
.slicknav_menu {
display: none;
}
}
@media screen and (max-width: 1200px) {
#scroll-title {
display: none;
}
#scroll-bar li:first-of-type {
margin-left: 0;
}
}
@media screen and (max-width: 1000px) {
#footer-menu {
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
}
@media screen and (max-width: 870px) {
#primary-menu li {
margin: 0 15px;
}
#scroll-bar {
display: none !important;
}
}
/*--------------------------------------------------------------
## Tablet
--------------------------------------------------------------*/
@media screen and (max-width: 767px) {
#footer-navigation {
width: 100%;
border-right: none;
border-bottom: 4px solid #f5ca6a;
padding-right: 0;
padding-bottom: 30px;
margin-bottom: 30px;
}
#footer-menu {
-moz-column-count: 4;
-webkit-column-count: 4;
column-count: 4;
}
#subscribe {
width: 100%;
padding-left: 0;
}
#intro .wrap {
display: block;
}
#intro #slider-container {
width: 100%;
margin-bottom: 40px;
}
#intro #slider .slide .slide-content .slide-post-category {
font-size: 24px;
line-height: 24px;
}
#intro #slider .slide .slide-content .slide-title {
font-size: 30px;
}
#intro #featured-category-posts {
width: 100%;
}
.post-grid-container {
display: block;
}
.post-grid-container .post-grid {
width: 100%;
margin-bottom: 40px;
}
.post-grid .post {
display: block;
}
.post-grid .post .entry-content-container {
order: 1;
width: 100%;
margin-bottom: 10px;
display: block;
}
.post-grid .post .entry-content-container .featured-image {
width: 100%;
}
.post-grid .post .entry-content-container .entry-content {
width: 100%; /* 535/820*/
}
.post-grid .post .share {
display: none;
}
.post-grid-container #primary {
width: 100%;
max-width: 300px;
margin: 0 auto;
}
#shop .wrap {
display: block;
}
#shop .widget-must-have {
width: 100%;
max-width: 290px;
margin: 0 auto 20px auto;
}
#shop .widget-carousel {
width: 100%;
}
.featured-post {
display: block;
margin-bottom: 40px;
}
.featured-post .entry-content-container {
width: 100%;
display: block;
}
.featured-post .featured-image {
width: 100%;
margin-bottom: 20px;
}
.featured-post .entry-content {
width: 100%;
}
.featured-post .share {
display: none;
}
.instagram-grid {
display: block;
}
.instagram-grid .widget {
width: 100%;
margin-bottom: 10px;
}
.instagram-grid .widget:last-of-type {
margin-bottom: 0;
}
#browse .wrap {
display: block;
}
#browse .wrap .widget {
width: 100%; /* 395/1200 */
margin: 0 auto 10px auto;
}
#single-post #main {
display: block;
}
#single-post #main .post-container {
width: 100%;
}
#single-post #main #sidebar {
width: 100%;
max-width: 300px;
margin: 0 auto;
}
#comment-form-right {
width: 100%;
}
#comment-form-left {
width: 100%;
}
#info-page {
display: block;
}
#info-page #main {
width: 100%;
}
#info-page #sidebar {
width: 100%;
max-width: 300px;
margin: 0 auto;
}
#travel-grid .travel-thumb {
width: 100%; /* 540/1120 */
}
#travel-grid .gap {
width: 100%; /* 540/1120 */
}
#about-page #main {
display: block;
}
#about-page #main .featured-image {
width: 100%;
max-width: 475px;
margin: 0 auto 40px auto;
}
#about-page #main .entry-content {
width: 100%;
}
#about-grid {
display: block;
}
#about-grid .about-column {
width: 100%;
}
#about-grid #about-right {
margin-top: 0;
}
}
@media screen and (max-width: 500px) {
#top-bar {
display: none;
}
#site-branding {
margin-top: 20px;
}
#footer-menu {
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
}
#intro #slider .slide .slide-content .slide-title {
font-size: 24px;
}
}