/*!
Theme Name: Mik
Theme URI: https://sharkthemes.com/downloads/mik/
Author: Shark Themes
Author URI: https://sharkthemes.com/
Description: Mik is a clean, dynamic and masonry gutenberg ready WordPress blog theme with an elegant, carefully crafted design. This powerful, responsive masonry blog theme is ideal for your personal or magazine-style blog, whether your passion is travel, beauty, nature, photography, architecture, DIY… the list goes on! Mik will make your WordPress look beautiful in all devices. Mik theme has wide list of customizable features including front page customizable sections with customizer api, wide and boxed layout, unlimited theme color and many more options. It comes with cross-browser compatibility, mobile friendly design and responsive features.
Version: 1.0.1
Requires PHP: 5.6
Tested up to: 5.4.2
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: mik
Tags: translation-ready, custom-header, custom-background, theme-options, custom-menu, featured-images, footer-widgets, left-sidebar, right-sidebar, full-width-template, two-columns, three-columns, four-columns, grid-layout, custom-logo, blog, portfolio, photography

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.

Mik is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/


/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Preloader
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
# Infinite scroll
# Layouts and Titles
# Media
	## Captions
	## Galleries
# Social Icons
# Breadcrumb
# Sections
	## Banner Slider
	## Introduction
	## Featured Posts
	## Call to Action
	## Latest Posts
# Footer
# Responsive

--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/

#loader {
    overflow-x: hidden;
    overflow-y: hidden;
    vertical-align: middle;
    background-color: #fff;
    position: fixed;
    display: table;
    width: 100%;
    top: 0;
    height: 100%;
    min-height: 100%;
    z-index: 9999;
}

.loader-container {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    z-index: 12;
    text-align: center;
}

.loader-container svg,
.blog-loader svg {
    -webkit-animation: rotating 2s linear infinite;
    -moz-animation: rotating 2s linear infinite;
    -ms-animation: rotating 2s linear infinite;
    -o-animation: rotating 2s linear infinite;
    animation: rotating 2s linear infinite;
    width: 50px;
    height: 50px;
}

.blog-loader svg {
    width: 35px;
    height: 35px;
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.backtotop {
    background-color: #206a5d;
    z-index: 300;
    width: 40px;
    height: 40px;
    line-height: 36px;
    font-size: 18px;
    text-align: center;
    position: fixed;
    bottom: -100px;
    right: 10px;
    cursor: pointer;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.backtotop:hover {
    /*background-color: #d18f7f;*/
}

.backtotop svg {
    display: inline-block;
    vertical-align: middle;
    fill: #fff;
}

.read-more {
    font-size: 16px;
    margin-top: 20px;
    width: auto;
    display: inline-block;
    text-transform: capitalize;
    font-weight: 500;
    padding-bottom: 5px;
    letter-spacing: 0.5px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.blog-loader-btn .read-more a {
    width: 100%;
    background-color: #333;
    padding: 12px 25px;
    display: inline-block;
    text-align: center;
    color: #fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.blog-loader-btn .read-more a:hover {
    background-color: #d18f7f;
}


/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    background: #f8f8f8;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Meiryo", Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.8;
    font-weight: normal;
    color: #333;
    background: #ebecf1;
    /* Fallback for when there is no custom background color defined. */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
    margin: 0 0 10px;
    padding: 0;
    line-height: 1.3;
}

h1 {
    font-size: 52px;
    /*font-size: 3.25rem;*/
}

h2 {
    font-size: 28px;
    /*font-size: 1.7rem;*/
}

h3 {
    font-size: 20px;
    /*font-size: 1.5rem;*/
    font-weight: bold;
    color: #206a5d;
}

h4 {
    font-size: 18px;
    /*font-size: 1.3rem;*/
}

h5 {
    font-size: 1.4px;
    /*font-size: 1rem;*/
}

h6 {
    font-size: 12px;
    /*font-size: 0.8rem;*/
}

p {
    margin: 10px 0;
    padding: 0;
    font-size: 16px;
    font-weight: normal;
    line-height: 30px;
    color: #333;
}


/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/

a {
    text-decoration: none;
    color: #333;
}

a:hover,
a:focus {
    color: #206a5d;
}

a:hover,
a:active {
    outline: 0;
}


/*--------------------------------------------------------------
## Default
--------------------------------------------------------------*/

#page {
    max-width: 1920px;
    margin: 0 auto;
    position: relative;
    overflow-x: hidden;
}

#content {
    position: relative;
}

.wrapper {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

.row {
    margin: 0 -15px;
}

.no-sidebar .wrapper.page-section {
    margin-left: auto;
    margin-right: auto;
}

.wrapper.page-section {
    padding: 80px 0;
    margin-bottom: 0;
}

.single .wrapper.page-section {
    /*padding: 50px 0;
    margin-bottom: 0;*/
    padding: 50px;
    margin-top: 30px;
    margin-bottom: 0;
    background: #fff;
}

@media (max-width: 478px) {
    .single .wrapper.page-section {
        padding: 20px;
    }
}

.page-section {
    margin-bottom: 50px;
}

.inner-header-image {
    text-align: center;
    position: relative;
}

.inner-header-image img {
    object-fit: cover;
    max-height: 600px;
}


/*--------------------------------------------------------------
## Header
--------------------------------------------------------------*/

#masthead {
    position: relative;
    width: 100%;
    z-index: 3000;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background: #206a5d;
}

.site-branding {
    text-align: center;
    display: flex;
    align-items: center;
    float: left;
    margin: 30px 0;
}

.site-branding img.custom-logo {
    max-width: 100%;
}

.main-navigation {
    display: block;
    position: relative;
    float: right;
    /*max-width: 75%;*/
    width: 100%;
}

.main-navigation:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: rgb(0,0,0);
    background: linear-gradient(45deg, rgba(0,0,0,0) 0%, rgb(196 251 109 / 20%) 50%, rgba(0,0,0,0) 100%);
    left: 0;
    top: 0;
}

.main-navigation ul {
    display: none;
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.main-navigation li {
    margin: 0;
    padding: 0;
}

.main-navigation ul.nav-menu>li>a {
    display: block;
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    padding: 20px;
}

.main-navigation ul.nav-menu>li>a:hover,
.main-navigation ul.nav-menu>li>a:focus {
    color: #fbd46d;
}


/*--------------------------------------------------------------
## Banner Slider
--------------------------------------------------------------*/

#custom-header {
    position: relative;
    /*margin-bottom: 50px;*/
}

.custom-header-content-wrapper {
    position: relative;
}

.custom-header-content-wrapper .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    top: 0;
    left: 0;
}

.custom-header-content-wrapper img {
    object-fit: cover;
    width: 100%;
    max-height: 1000px;
}


/*--------------------------------------------------------------
## Introduction
--------------------------------------------------------------*/

#introduction {}

#introduction .page-section article {
    margin: 0;
    position: relative;
    border-bottom: solid 10px #1f4068;
    border-right: solid 10px #23538e;
    background: rgb(187 225 250 / 0.3);
}

#introduction .page-section article:before {  
  content: " ";
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 0;
  height: 0;
  border-width: 0 11px 11px 0px;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #ebecf1;
}

#introduction .page-section article:after {  
  content: " ";
  position: absolute;
  top: 0;
  right: -10px;
  width: 0;
  height: 0;
  border-width: 0px 11px 11px 0px;
  border-style: solid;
  border-color: #ebecf1;
  border-bottom-color: transparent;
}

#introduction .post-wrapper {
    display: flex;
}

#introduction .post-wrapper .entry-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 50%;
    padding-right: 50px;
    padding-left: 50px;
    text-align: center;
}

#introduction .post-wrapper .entry-container .entry-header h2.entry-title {
    font-weight: bold;
}

#introduction .post-wrapper .entry-container .entry-content {}

#introduction .post-wrapper .entry-container .entry-content p {}

#introduction .post-wrapper .featured-image {
    width: 50%;
}


/*--------------------------------------------------------------
## Intro
--------------------------------------------------------------*/

#intro {}

#intro .page-section article {
    margin: 0;
}

#intro .post-wrapper {
    display: flex;
}

#intro .post-wrapper .featured-image {
    width: 50%;
}

#intro .post-wrapper .entry-container {
    width: 50%;
    padding-left: 50px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

#intro .post-wrapper .entry-container .entry-header h2.entry-title {
    font-weight: bold;
}

#intro .post-wrapper .entry-container .entry-content p {}


/*--------------------------------------------------------------
## Call to Action
--------------------------------------------------------------*/

#cta-section {
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

#cta-section .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 50%);
}

#cta-section .entry-container {
    position: relative;
    text-align: center;
    min-height: 500px;
    padding: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width: 1000px;
    margin: auto;
}

#cta-section .entry-container .entry-header h2.entry-title {
    color: #fff;
    font-weight: bold;
}

#cta-section .entry-container .entry-content {}

#cta-section .entry-container .entry-content p {
    display: block;
    color: #fff;
}


/*--------------------------------------------------------------
## Featured Posts
--------------------------------------------------------------*/

#featured-posts {
    background: #e3e4ea;
}

#featured-posts .wrapper {
    overflow: hidden;
    position: relative;
    padding: 40px 0;
}

#featured-posts .section-content article {
    padding: 0 15px;
    margin: 0;
}

#featured-posts .featured-image,
.blog-posts-wrapper .featured-image {}

#featured-posts .featured-image img,
.blog-posts-wrapper .featured-image img {
    width: 100%;
    min-height: 250px;
    object-fit: cover;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

.blog-posts-wrapper .featured-image {
    overflow: hidden;
}

#featured-posts article .entry-container,
.blog-posts-wrapper article .entry-container {
    margin-top: 5px;
    padding: 20px 20px 10px;
    position: relative;
    top:0;
    text-align: center;
}

#featured-posts article .entry-container:before,
.blog-posts-wrapper article .entry-container:before,
#featured-posts article .entry-container:after,
.blog-posts-wrapper article .entry-container:after{ 
    position: absolute;
    top: 0;
    content:'';
    width: 20px;
    height: 100%;
    display: inline-block
}
#featured-posts article .entry-container:before,
.blog-posts-wrapper article .entry-container:before{
    border-left: dotted 1px #206a5d;
    border-top: solid 1px #206a5d;
    border-bottom: solid 1px #206a5d;
    left: 0;
}
#featured-posts article .entry-container:after,
.blog-posts-wrapper article .entry-container:after{
    content: '';
    border-top: solid 1px #206a5d;
    border-right: dotted 1px #206a5d;
    border-bottom: solid 1px #206a5d;
    right: 0;
}

#featured-posts article .entry-container .entry-header h3.entry-title,
.blog-posts-wrapper article .entry-container .entry-header h3.entry-title {
    position: relative;
    margin-bottom: 15px;
    padding-bottom: 15px;
}

#featured-posts article .entry-container .entry-header h3.entry-title:after,
.blog-posts-wrapper article .entry-container .entry-header h3.entry-title:after {
    position: absolute;
    content: "";
    width: 70px;
    height: 1px;
    background: #206a5d;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 0;
}

#featured-posts article .entry-container .entry-header h3.entry-title a,
.blog-posts-wrapper article .entry-container .entry-header h3.entry-title a {
    color: #206a5d;
}

#featured-posts article .entry-container .entry-content p,
.blog-posts-wrapper article .entry-container .entry-content p  {
    margin-top: 0;
}


/*--------------------------------------------------------------
## Single
--------------------------------------------------------------*/

.single-template-wrapper .site-main {}

.single-post article.hentry {
    margin-bottom: 0;
}

.single-template-wrapper .site-main .page-header h1.page-title {
    font-size: 26px;
    font-weight: normal;
}

.single-template-wrapper .site-main .entry-container .entry-content h2 {
    font-size: 20px;
    font-weight: bold;
    color: #206a5d;
}

.single-template-wrapper .site-main .entry-container .entry-content p {}


/*--------------------------------------------------------------
## Secondary
--------------------------------------------------------------*/

#secondary .widget {
    margin: 0 0 30px;
    padding: 20px;
    background: rgb(187 225 250 / 0.1);
}

#secondary .widget h2.widget-title {
    font-size: 20px;
    font-weight: bold;
    background: #1f4068;
    padding: 10px 20px;
}

#secondary .widget h2.widget-title a {
    color: #fff;
}

#secondary .widget ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#secondary .widget ul li {
    margin: 0 0 7px;
    padding: 10px 20px;
    border: solid 1px #dfebf1;
    border-left: solid 3px #dfebf1;
    border-right: solid 3px #dfebf1;
}

#secondary .widget ul li:last-child {}

#secondary .widget ul li a {
    font-size: 16px;
    font-weight: normal;
    color: #333;
}

#secondary .widget ul li a:hover {
    font-weight: bold;
}


/*--------------------------------------------------------------
#                   Footer
--------------------------------------------------------------*/

#colophon.site-footer {
    margin: 0;
    padding: 0;
    background: none;
}

.site-info {
    padding: 20px 0;
}

.site-info .wrapper.column-2 {
    text-align: right;
}

.site-info .copyright p {
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: normal;
    color: #393e46;
}

.site-info .copyright a {
    color: #206a5d;
    font-weight: bold;
}

.site-info .copyright a:hover,
.site-info .copyright a:focus {
    border-bottom: 1px solid #206a5d;
}

.site-info .social-menu ul li a svg {
    width: 15px;
    height: 15px;
}

.social-menu ul li a svg {
    fill: #206a5d;
}

.social-menu ul li {
    float: left;
    list-style: none;
}

.social-menu li:not(:last-child) {
    margin-right: 30px;
}


article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
    display: block;
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline;
}

audio:not([controls]) {
    display: none;
    height: 0;
}

[hidden],
template {
    display: none;
}

a {
    background-color: transparent;
}

a:active,
a:hover {
    outline: 0;
}

abbr[title] {
    border-bottom: 1px dotted;
}

b,
strong {
    font-weight: bold;
}

dfn {
    font-style: italic;
}

mark {
    background: #ff0;
    color: #333;
}

small {
    font-size: 80%;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

img {
    border: 0;
}

svg:not(:root) {
    overflow: hidden;
}

figure {
    margin: 1em 40px;
}

hr {
    box-sizing: content-box;
    height: 0;
}

pre {
    overflow: auto;
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}

button {
    overflow: visible;
}

button,
select {
    text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

button[disabled],
html input[disabled] {
    cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

input {
    line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

legend {
    border: 0;
    padding: 0;
}

textarea {
    overflow: auto;
}

optgroup {
    font-weight: bold;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

td,
th {
    padding: 8px;
    border: 1px solid #333;
}

td#next {
    text-align: right;
}


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

button,
input,
select,
textarea {
    font-size: 16px;
    line-height: 30px;
    letter-spacing: 0.5px;
    font-weight: 400;
}

dfn,
cite,
em,
i {
    font-style: italic;
}

blockquote {
    margin: 0 1.5em;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    font-family: "Courier 10 Pitch", Courier, monospace;
    font-size: 16px;
    font-size: 0.9375rem;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1.6em;
}

code,
kbd,
tt,
var {
    font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    font-size: 16px;
    font-size: 0.9375rem;
}

abbr,
acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

mark,
ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}


/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

html {
    box-sizing: border-box;
}

*,
*:before,
*:after {
    /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
    box-sizing: inherit;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
}

blockquote,
q {
    quotes: "" "";
}

blockquote {
    background-color: #f6f6f6;
    padding: 15px;
    border-left: 5px solid #ccc;
}

hr {
    background-color: #ccc;
    border: 0;
    height: 1px;
    margin-bottom: 1.5em;
}

ol {
    margin: 0;
    padding-left: 1.5em;
}

ol {
    list-style: decimal;
}

li>ul,
li>ol {
    margin-bottom: 0;
    margin-left: 0.5em;
}

dt {
    font-weight: bold;
    margin-bottom: 1em;
}

dd {
    margin: 0 1.5em 1.5em;
}

img {
    height: auto;
    /* Make sure images are scaled correctly. */
    max-width: 100%;
    /* Adhere to container width. */
    vertical-align: middle;
}

figure {
    margin: 1em 0;
    /* Extra wide images within figure tags don't overflow the content area. */
}

table {
    margin: 0 0 1.5em;
    width: 100%;
}


/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    border: 1px solid;
    border-color: #ccc #ccc #bbb;
    border-radius: 3px;
    background: #e6e6e6;
    color: rgba(0, 0, 0, .8);
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1;
    padding: .6em 1em .4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
    border-color: #ccc #bbb #aaa;
}

button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
    border-color: #aaa #bbb #bbb;
}

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 {
    color: #666;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 3px;
}

select {
    border: 1px solid #ccc;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
    color: #111;
}


/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

#top-menu {
    background-color: #333;
    padding: 8px 0;
}

#top-menu svg.icon-up,
#top-menu svg.icon-down {
    margin: auto;
    display: block;
    cursor: pointer;
    fill: #fff;
}

#top-menu ul {
    padding: 0;
}

#top-menu svg.icon-up,
#top-menu.top-menu-active svg.icon-down {
    display: none;
}

#top-menu.top-menu-active svg.icon-up {
    display: block;
}

.secondary-menu {
    float: left;
}

.secondary-menu a {
    font-family: 'Playfair Display', sans-serif;
    font-weight: 400;
    color: #fff;
    font-size: 16px;
}

.secondary-menu a:hover {
    color: #333;
}

.secondary-menu ul li:not(:last-child):after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin: 0 14px;
    border-radius: 100%;
}

.nav-shrink .main-navigation:before,
.nav-shrink .main-navigation:after {
    display: none;
}

.nav-shrink .main-navigation {
    border: none;
}

.main-navigation ul.sub-menu {
    background-color: #333;
    text-align: left;
    padding: 0;
    border: 1px solid rgba(52, 59, 61, 0.05);
}

.main-navigation ul.sub-menu li a {
    padding: 10px;
    color: #fff;
    font-weight: 400;
    font-size: 15px;
    text-transform: capitalize;
    border-bottom: 1px solid rgba(52, 59, 61, 0.2);
}

.main-navigation ul.sub-menu a:after {
    float: right;
}

.main-navigation ul ul {
    float: left;
    position: absolute;
    top: 100%;
    left: -999em;
    z-index: 99999;
}

.main-navigation ul ul ul {
    left: -999em;
    top: -1px;
}

.main-navigation ul ul a {
    width: 225px;
}

.main-navigation svg {
    fill: #333;
    margin-left: 5px;
    width: 16px;
    height: 14px;
}

.main-navigation ul li a:hover svg {
    fill: #d18f7f;
}

.main-navigation li.menu-item-has-children ul li svg {
    fill: #fff;
    width: 14px;
    height: 16px;
}

.main-navigation .current_page_item>a,
.main-navigation .current-menu-item>a,
.main-navigation .current_page_ancestor>a,
.main-navigation .current-menu-ancestor>a {
    color: #d18f7f;
}

svg {
    width: 14px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
}

.main-navigation svg.icon-down {
    width: 12px;
    height: 12px;
    margin-left: 5px;
}

.main-navigation svg.icon-right {
    width: 12px;
    height: 12px;
    fill: #333;
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.menu-toggle {
    border-radius: 0;
    font-size: 16px;
    margin: auto;
    outline: none;
    display: block;
    height: 50px;
    position: relative;
    background-color: transparent;
    min-width: 64px;
    border-top: 1px solid #333;
    border: none;
}

svg.icon-menu {
    fill: #fff;
    width: 30px;
    height: 30px;
    vertical-align: baseline;
}

.menu-open svg.icon-menu {
    display: none;
}

.main-navigation svg.icon-close {
    display: none;
}

button.dropdown-toggle {
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
    background-color: transparent;
    border: none;
    width: 45px;
    height: 55px;
    outline: none;
}

button.menu-toggle:focus {
    border: thin dotted #fff;
}

button.dropdown-toggle:focus {
    border: thin dotted;
}


/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/


/* Text meant only for screen readers. */

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    word-wrap: normal !important;
    /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar. */
}


/* Do not show the outline on the skip link target. */

#content[tabindex="-1"]:focus {
    outline: 0;
}


/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/

.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}

.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}


/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/

.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after,
.wrapper:before,
.wrapper:after,
.blog-posts-wrapper:before,
.blog-posts-wrapper:after,
.section-content:before,
.section-content:after {
    content: "";
    display: table;
    table-layout: fixed;
}

.clear:after,
.entry-content:after,
.site-header:after,
.site-content:after,
.site-footer:after,
.wrapper:before,
.wrapper:after,
.blog-posts-wrapper:before,
.blog-posts-wrapper:after,
.section-content:before,
.section-content:after {
    clear: both;
}


/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/

.widget {
    margin: 0 0 30px;
}


/* Make sure select elements fit in widgets. */

.widget select {
    max-width: 100%;
    background-color: #f6f6f6;
    padding: 10px;
    border: none;
    width: 100%;
    max-width: 300px;
}

.widget select:focus {
    outline: thin dotted;
}

.widget input {
    outline: none;
    height: 40px;
    border-radius: 0;
    padding: 0 15px;
    border: none;
}

input[type="submit"] {
    background-color: #333;
    color: #fff;
    font-size: 14px;
}

input[type="submit"]:hover,
input[type="submit"]:focus {
    background-color: #d18f7f;
}

.jetpack_subscription_widget {
    text-align: center;
}

.jetpack_subscription_widget input[type="email"] {
    width: 100%;
    margin-bottom: 10px;
}

.jetpack_subscription_widget input[type="submit"] {
    min-width: 100px;
    text-align: center;
}

.jetpack_subscription_widget #subscribe-text {
    display: inline-block;
}

.jetpack_subscription_widget #subscribe-text p {
    margin-top: 0;
    line-height: 25px;
}

.jetpack_subscription_widget #subscribe-submit {
    margin-bottom: 0;
}


/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/

.sticky {
    display: block;
}

.grid-item,
.hentry {
    margin: 0 0 30px;
}

.updated:not(.published) {
    display: none;
}


/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/


/* Globally hidden elements when Infinite Scroll is supported and in use. */

.infinite-scroll.neverending .site-footer {
    /* Theme Footer (when set to scrolling) */
    display: none;
}


/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */

.infinity-end.neverending .site-footer {
    display: block;
}


/*--------------------------------------------------------------
# Filter Posts
--------------------------------------------------------------*/

#filter-posts {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.filter-posts-category {
    float: left;
    margin-right: 5px;
    font-weight: 700;
}

.filter-posts-tag {
    float: left;
    margin-right: 5px;
    font-weight: 700;
}

.filter-posts-tag svg.icon.icon-tag {
    transform: rotate(90deg);
    margin-right: 5px;
    fill: #d18f7f;
    margin-top: -3px;
}

.filter-posts-category svg.icon.icon-list {
    margin-right: 5px;
    height: 15px;
    fill: #d18f7f;
    margin-top: -3px;
}

#filter-posts .cat-filter ul,
#filter-posts .tag-filter ul {
    padding: 0;
    float: left;
}

#filter-posts ul li:not(:first-child):before {
    content: ' ';
    margin: 0 8px;
}

#filter-posts ul li {
    float: left;
    list-style: none;
    font-size: 16px;
    font-weight: 500;
}

#filter-posts ul li.active a {
    font-weight: 700;
}


/*--------------------------------------------------------------
# Layouts and titles
--------------------------------------------------------------*/

section {
    position: relative;
}

.relative {
    display: block;
    position: relative;
}

.relative:before,
.relative:after {
    content: "";
    display: table;
    clear: both;
}

.blog-posts-wrapper.column-4 .entry-title {
    font-size: 26px;
}

.blog-posts-wrapper.column-5 .entry-title {
    font-size: 24px;
}

.section-header {
    margin-bottom: 30px;
}

.section-title {
    font-size: 3rem;
    font-weight: 600;
    font-family: 'Playfair Display', sans-serif;
    margin: 0;
    word-wrap: break-word;
    line-height: 1.75;
    letter-spacing: 0.5px
}

.add-separator:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #d18f7f;
    display: inline-block;
    margin-left: 5px;
    border-radius: 50px;
}

.section-title .color-red,
.widgettitle .color-red {
    font-style: italic;
    margin-right: 5px;
}

.column-2 .column-wrapper:nth-child(2n+1),
.column-2 article:nth-child(2n+1) {
    clear: left;
}

.column-3 .column-wrapper:nth-child(3n+1),
.column-3 article:nth-child(3n+1) {
    clear: left;
}

.column-4 .column-wrapper:nth-child(4n+1),
.column-4 article:nth-child(4n+1) {
    clear: left;
}

.display-none {
    display: none;
}

.display-block {
    display: block;
}

.black-overlay {
    background-color: #333;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.5;
}

.align-center {
    text-align: center;
}


/* Make sure embeds and iframes fit their containers. */

embed,
iframe,
object {
    max-width: 100%;
}


/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/

.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}

.wp-caption-text {
    text-align: center;
}


/*--------------------------------------------------------------
## Social Icons
--------------------------------------------------------------*/

.social-icons li {
    display: inline-block;
    height: auto;
    text-align: center;
    position: relative;
    list-style: none;
}

.social-icons {
    margin: 0;
    padding: 0;
}

ul.social-icons li a {
    width: 35px;
    height: 35px;
    line-height: 33px;
    display: block;
}

.social-icons a:focus,
.social-menu ul li a:focus {
    outline: none;
}

#top-menu .social-menu ul li a:hover,
#top-menu .social-menu ul li a:focus {
    background-color: transparent;
}


/*social links hover effect */

ul.social-icons li a[href*="facebook.com"]:hover svg,
.social-menu ul li a[href*="facebook.com"]:hover svg {
    fill: #3b5998;
}

ul.social-icons li a[href*="pinterest.com"]:hover svg,
.social-menu ul li a[href*="pinterest.com"]:hover svg {
    fill: #cb2027;
}

ul.social-icons li a[href*="youtube.com"]:hover svg,
.social-menu ul li a[href*="youtube.com"]:hover svg {
    fill: #bb0000;
}

ul.social-icons li a[href*="twitter.com"]:hover svg,
.social-menu ul li a[href*="twitter.com"]:hover svg {
    fill: #00aced;
}

ul.social-icons li a[href*="dribbble.com"]:hover svg,
.social-menu ul li a[href*="dribbble.com"]:hover svg {
    fill: #ea4c89;
}


/*--------------------------------------------------------------
## Slick
--------------------------------------------------------------*/

.slick-prev,
.slick-next {
    border: 1px solid #fff;
    width: 50px;
    height: 50px;
    z-index: 1;
    border-radius: 50px;
    left: 0;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.slick-prev:hover,
.slick-next:hover,
.slick-prev:focus,
.slick-next:focus {
    background-color: #206a5d;
    border-color: #96eadb;
}

.slick-prev:before,
.slick-next:before {
    background-image: url('data:image/svg+xml; utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512"><path fill="%23fff" d="M187.8 264.5L41 412.5c-4.7 4.7-12.3 4.7-17 0L4.2 392.7c-4.7-4.7-4.7-12.3 0-17L122.7 256 4.2 136.3c-4.7-4.7-4.7-12.3 0-17L24 99.5c4.7-4.7 12.3-4.7 17 0l146.8 148c4.7 4.7 4.7 12.3 0 17z"></path></svg>');
    content: "";
    background-repeat: no-repeat;
    width: 7px;
    height: 18px;
    display: inline-block;
    text-align: center;
    margin: auto;
    color: #fff;
}

.slick-prev:before {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.slick-next:before {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

.slick-prev {
    left: 20px;
    right: auto;
}

.slick-next {
    right: 20px;
    left: auto;
}

.slick-dots li {
    margin: 0;
    width: 25px;
    height: 20px;
}

.slick-dots li button {
    padding: 0;
    width: auto;
    height: auto;
}

.slick-dots li.slick-active button:before {
    opacity: 1;
    color: #333;
    background-color: transparent;
}

.slick-dots li button:before {
    font-size: 25px;
}

.slick-dots {
    bottom: -40px;
}

.slick-dotted.slick-slider {
    margin-bottom: 20px;
}


/*--------------------------------------------------------------
# 					RESPONSIVE
--------------------------------------------------------------*/

@media screen and (min-width: 600px) {
    .contact-form p.name,
    .contact-form p.email {
        width: 50%;
        float: left;
    }
    .contact-form p.email input {
        float: right;
    }
    .contact-form p.name input,
    .contact-form p.email input {
        max-width: 388px;
    }
    .contact-form p.name {
        padding-right: 5px;
    }
    .contact-form p.email {
        padding-left: 5px;
    }
}

@media screen and (min-width: 767px) {
    .column-1 .column-wrapper {
        width: 100%;
    }
    .column-2 .column-wrapper {
        width: 50%;
        float: left;
    }
    .column-3 .column-wrapper {
        width: 33.33%;
        float: left;
    }
    .column-4 .column-wrapper {
        width: 50%;
        float: left;
    }
    .column-5 .column-wrapper {
        width: 20%;
        float: left;
    }
    .column-6 .column-wrapper {
        width: 16.66%;
        float: left;
    }
    .column-2 article {
        width: 50%;
        padding: 0 15px;
        float: left;
    }
    .column-2 article:nth-child(-n+2) {
        margin-top: 0;
    }
    .column-3 article {
        width: 33.33%;
        padding: 0 15px;
        float: left;
    }
    .column-4 article {
        width: 25%;
        padding: 0 10px;
        float: left;
    }
    .column-5 article {
        width: 20%;
        padding: 0 10px;
        float: left;
    }
    .column-6 article {
        width: 16.66%;
        padding: 0 10px;
        float: left;
    }
    #featured-posts .section-content {
        margin: 0 -10px;
    }
    .blog-posts-wrapper article:nth-child(-n+3) {
        margin-top: 0;
    }
    #top-menu svg.icon-down {
        display: none;
    }
    .site-footer .column-5 .column-wrapper {
        padding-right: 15px;
    }
    .site-footer .column-5 .column-wrapper:nth-child(1) {
        padding-right: 25px;
    }
    #top-menu .wrapper {
        display: block !important;
    }
    .blog-posts-wrapper.column-3 article:nth-child(3n+1) {
        clear: left;
        margin-bottom: 30px;
    }
    #colophon .column-wrapper {
        padding-right: 25px;
    }
}

@media screen and (min-width: 992px) {
    .column-4 .column-wrapper {
        width: 25%;
        float: left;
    }
    #cta-section {
        margin-top: 50px;
    }
    .right-sidebar #primary {
        width: 70%;
        float: left;
    }
    .right-sidebar #secondary {
        width: 30%;
        float: right;
    }
    .right-sidebar #primary {
        padding-right: 15px;
    }
    .right-sidebar #secondary {
        padding-left: 15px;
    }
    .left-sidebar #secondary {
        width: 30%;
        float: left;
        padding-right: 15px;
        padding-left: 0;
    }
    .left-sidebar #primary {
        width: 70%;
        float: right;
        padding-left: 15px;
    }
    .site-footer .column-4 .column-wrapper:nth-child(1) {
        width: 33%;
        padding-right: 60px;
    }
    .site-footer .column-4 .column-wrapper {
        padding-right: 25px;
        width: 22%;
    }
}

@media screen and (min-width: 1024px) {
    #masthead.site-header.sticky-header.nav-shrink {
        position: fixed;
        background: #fff;
        top: 0;
        left: 0;
        right: 0;
        box-shadow: 0 1px 15px rgba(0, 0, 0, 0.1);
    }
    .site-branding img.custom-logo {
        max-height: 180px;
        width: auto;
        margin-right: 15px;
    }
    #masthead.center-align .site-branding img.custom-logo {
        max-height: 180px;
        margin-right: 0;
    }
    #masthead.site-header.sticky-header.nav-shrink.center-align .wrapper {
        display: block;
    }
    #masthead.site-header.sticky-header.nav-shrink.center-align .wrapper .site-branding {
        flex-direction: row;
        margin-top: 5px;
    }
    #masthead.site-header.sticky-header.nav-shrink.center-align .wrapper .site-title a {
        font-size: 2.5rem;
    }
    #masthead.site-header.sticky-header.nav-shrink.center-align .wrapper .site-details {
        text-align: left;
    }
    #masthead.site-header.sticky-header.nav-shrink.center-align .wrapper .site-description {
        margin-top: 10px;
        display: inline;
    }
    #masthead.site-header.sticky-header.nav-shrink .site-branding img.custom-logo {
        max-height: 80px;
        margin-right: 15px;
    }
    #masthead.center-align .wrapper {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    #masthead.center-align .wrapper .site-branding {
        /*margin-top: 45px;*/
        flex-direction: column;
        height: auto;
    }
    #masthead.center-align .site-title a {
        font-size: 4rem;
    }
    #masthead.center-align .wrapper .site-details {
        text-align: center;
    }
    #masthead.center-align .wrapper .site-description {
        display: block;
    }
    #masthead.left-absolute {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.1) 60%, rgba(0, 0, 0, 0) 90%);
    }
    .left-absolute .main-navigation svg {
        fill: #fff;
    }
    #masthead.left-absolute .main-navigation a,
    #masthead.left-absolute .site-description,
    #masthead.left-absolute .site-title a {
        color: #fff;
    }
    #masthead.left-absolute.sticky-header.nav-shrink .main-navigation ul.nav-menu>li>a,
    #masthead.left-absolute.sticky-header.nav-shrink .site-description,
    #masthead.left-absolute.sticky-header.nav-shrink .site-title a {
        color: #333;
    }
    #masthead.left-absolute.sticky-header.nav-shrink.left-absolute .main-navigation ul.nav-menu>li>a>svg {
        fill: #333;
    }
    .main-navigation {
        text-align: center;
    }
    .main-navigation ul.nav-menu {
        display: block !important;
    }
    .main-navigation ul li:hover>ul,
    .main-navigation ul li.focus>ul {
        left: auto;
    }
    #masthead.left-align .main-navigation ul li:hover>ul,
    #masthead.left-align .main-navigation ul li.focus>ul,
    #masthead.left-absolute .main-navigation ul li:hover>ul,
    #masthead.left-absolute .main-navigation ul li.focus>ul {
        left: auto;
        right: 0;
    }
    .main-navigation ul ul li:hover>ul,
    .main-navigation ul ul li.focus>ul {
        left: 100%;
    }
    #masthead.left-align .main-navigation ul ul li:hover>ul,
    #masthead.left-align .main-navigation ul ul li.focus>ul,
    #masthead.left-absolute .main-navigation ul ul li:hover>ul,
    #masthead.left-absolute .main-navigation ul ul li.focus>ul {
        left: -100%;
        width: 100%;
    }
    .main-navigation .menu-item-has-children>a:after {
        float: none;
    }
    .main-navigation:after {
        top: auto;
    }
    .main-navigation ul.sub-menu li:hover>a,
    .main-navigation ul.sub-menu li:focus>a {
        color: #fff;
        padding-left: 17px;
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }
    .main-navigation ul.sub-menu li a svg {
        float: right;
        -ms-transform: rotate(-90deg);
        /* IE 9 */
        -webkit-transform: rotate(-90deg);
        /* Safari 3-8 */
        transform: rotate(-90deg);
    }
    #masthead.left-align .main-navigation ul.sub-menu li a svg,
    #masthead.left-absolute .main-navigation ul.sub-menu li a svg {
        -ms-transform: rotate(90deg);
        /* IE 9 */
        -webkit-transform: rotate(90deg);
        /* Safari 3-8 */
        transform: rotate(90deg);
    }
    .main-navigation ul.sub-menu li:hover>a svg,
    .main-navigation ul.sub-menu li:focus>a svg {
        fill: #fff;
    }
    button.dropdown-toggle {
        display: none;
    }
    .menu-toggle {
        display: none;
    }
    .main-navigation ul {
        display: block;
    }
    .main-navigation li {
        display: inline-block;
    }
}

@media screen and (min-width: 1180px) {
    #cta-section {
        margin-top: 60px;
    }
}

@media screen and (min-width: 1900px) {
    #page {
        box-shadow: 0 0 50px #333;
    }
    .wrapper {
        max-width: 1500px;
    }
}

@media screen and (max-width: 1200px) {
    .main-navigation ul.nav-menu>li>a {
        padding: 20px 5px;
    }
    #filter-posts {
        flex-direction: column;
    }
    #filter-posts.column-2 .tag-filter {
        margin-top: 15px;
    }
    #featured-posts .featured-image img {
        width: 100%;
        min-height: 400px;
        object-fit: cover;
    }
}

@media screen and (max-width: 1023px) {
    body.home #masthead,
    #masthead {
        margin-bottom: 0;
    }
    .site-branding {
        float: none;
        display: block;
        justify-content: center;
        margin: 0 auto;
        text-align: center;
        word-break: break-word;
        height: auto;
    }
    .site-details {
        text-align: center;
    }
    .main-navigation {
        padding: 0;
        margin-bottom: 30px;
        background: #175d50;
        float: none;
        max-width: 100%;
    }
    .main-navigation ul.nav-menu>li>a {
        line-height: 1;
    }
    .main-navigation a {
        border-bottom: 1px solid rgb(255 255 255 / 25%);
    }
    .main-navigation ul ul a {
        width: 100%;
    }
    .main-navigation ul ul,
    .main-navigation ul ul ul {
        box-shadow: none;
        float: none;
        position: relative;
        top: 0;
        left: 0;
        margin-bottom: 0;
        display: none;
    }
    #site-header-menu .wrapper {
        width: 100%;
    }
    .main-navigation ul.sub-menu li {
        padding-right: 0;
    }
    .main-navigation .menu-item-has-children>a:before {
        content: "";
        float: right;
        position: relative;
        right: 25px;
        background-color: #333;
        width: 1px;
        height: 25px;
    }
    .main-navigation .menu-item-has-children>a:after {
        padding-top: 3px;
    }
    .main-navigation ul.nav-menu>li>a,
    .main-navigation ul.sub-menu li a {
        padding: 15px 15px 15px 25px;
    }
    .main-navigation ul.menu li.current-menu-item>a {
        font-weight: 500;
    }
    .main-navigation li.menu-item-has-children ul li svg,
    .main-navigation .dropdown-toggle svg {
        fill: #333;
    }
    .main-navigation .menu-item-has-children a svg {
        display: none;
    }
    .main-navigation ul.sub-menu {
        background-color: #eee;
    }
    .main-navigation ul.nav-menu {
        margin-right: 0;
        background-color: #175d50;
        margin-top: 25px;
    }
    .main-navigation a {
        color: #333;
    }
    .main-navigation ul.nav-menu>li>a,
    .main-navigation ul.nav-menu>li>a:hover {
        color: #fff;
    } {
        color: #fff;
    }
    .main-navigation svg.icon-down {
        fill: #333;
    }
    .main-navigation ul.sub-menu {
        border-top: 1px solid #333;
    }
    .menu-open .menu-toggle .icon-close {
        display: block;
        fill: #fff;
        margin: auto;
        width: 20px;
        height: 20px;
    }
    .menu-open .menu-toggle {
        padding-top: 6px;
    }
    .site-branding {
        padding: 25px 0;
    }
    .site-title a {
        font-size: 3rem;
        text-align: center;
    }
    .site-description {
        text-align: center;
    }
    #masthead.site-header .main-navigation ul.nav-menu {
        margin-top: 0;
        position: relative;
        top: 0;
        left: 0;
        right: 0;
    }
    #masthead.site-header.sticky-header.nav-shrink .main-navigation ul.nav-menu {
        top: 0;
        overflow-y: auto;
        max-height: 480px;
    }
    #top-menu {
        padding: 13px 0;
    }
    .main-navigation li {
        text-align: center;
    }
    .main-navigation ul.sub-menu li a {
        color: #333;
    }
    .main-navigation ul.sub-menu li:hover a {
        color: #d18f7f;
    }
    .single-post article blockquote {
        margin: 15px -40px;
    }
    .column-1 .custom-header-content-wrapper img {
        min-height: 800px;
    }
}

@media screen and (max-width: 992px) {
    .custom-header-content-wrapper img {
        max-height: 500px;
        object-fit: cover;
    }
    .site-branding img.custom-logo {
        max-width: 180px;
        height: auto;
    }
    #introduction .post-wrapper,
    .home.blog header.page-header {
        flex-direction: column;
    }
    #introduction .page-section {
        padding-top: 10px;
    }
    #introduction .post-wrapper .featured-image,
    #introduction .post-wrapper .entry-container {
        width: 100%;
    }
    #introduction .post-wrapper .featured-image {
        margin-top: 25px;
    }
    #introduction .post-wrapper .entry-container {
        padding-right: 20px;
        padding-left: 20px;
        padding-top: 30px;
    }
    #introduction .post-wrapper .featured-image img {
        width: 100%;
        max-height: 400px;
        object-fit: cover;
    }
    #intro .post-wrapper {
        flex-direction: column;
    }
    #intro .page-section {
        /*padding-top: 10px;*/
    }
    #intro .post-wrapper .featured-image,
    #intro .post-wrapper .entry-container {
        width: 100%;
    }
    #intro .post-wrapper .entry-container {
        margin-top: 25px;
        padding-left: 0;
    }
    #intro .post-wrapper .featured-image img {
        width: 100%;
        max-height: 400px;
        object-fit: cover;
    }
    #cta-section {
        margin-top: 30px;
    }
    #secondary {
        clear: both;
        margin-top: 50px;
    }
    #secondary section.widget {
        padding: 0;
        margin-bottom: 0;
    }
    #secondary .widget:not(:last-child) {
        margin-bottom: 20px;
    }
    #secondary .widget_google_ad {
        text-align: center;
    }
    .site-info .social-menu {
        display: inline-block;
        clear: both;
        margin: 10px auto 20px;
    }
    .site-info .wrapper.column-2 {
        text-align: center;
        display: block;
    }
    .textwidget img {
        max-width: 100%;
        margin: 25px 0;
    }
    .single-post .post-wrapper {
        width: 90%;
    }
    #secondary .post-wrapper,
    #colophon .post-wrapper {
        width: 100%;
    }
    .single-post article blockquote {
        margin: 15px 0;
    }
    .single-post article blockquote {
        padding: 50px;
    }
    .widget_instagram .column-4 li,
    .widget_instagram .column-5 li,
    .widget_instagram .column-6 li {
        width: 50%;
    }
    .custom-header-content h2 a {
        font-size: 56px;
    }
    .wrapper.page-section {
        padding: 40px 0;
    }
}

@media screen and (max-width: 800px) {
    #featured-posts .featured-image img,
    .blog-posts-wrapper .featured-image img {
        width: 100%;
        /*min-height: 300px;*/
        min-height: 150px;
        object-fit: cover;
    }
    .column-4 article {
        width: 50%;
        float: left;
        margin-top: 30px;
        margin-bottom: 0;
    }
    .column-4 article:nth-child(-n+2) {
        margin-top: 0;
    }
    .contact-information .contact-form {
        padding: 25px;
    }
    .column-2 .custom-header-content,
    .column-3 .custom-header-content,
    .column-4 .custom-header-content,
    .banner-slider.left-align .custom-header-content,
    .banner-slider.right-align .custom-header-content,
    .custom-header-content {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }
    .custom-header-content h2 a {
        font-size: 48px;
    }
}

@media screen and (max-width: 767px) {
    #top-menu {
        padding: 15px 0;
    }
    .site-branding img.custom-logo {
        max-width: 180px;
        height: auto;
    }
    .column-1 .custom-header-content-wrapper img {
        min-height: 500px;
    }
    .page-template-aboutpage #custom-header,
    .home.page #custom-header {
        margin-bottom: 40px;
    }
    #featured-posts .section-content article {
        padding: 0;
        width: 100%;
        margin-bottom: 30px;
    }
    .blog-posts-wrapper {
        margin: 0;
    }
    .custom-header-content p {
        font-size: 0.968rem;
    }
    .custom-header-content {
        min-width: 75%;
        min-height: auto;
    }
    .no-sidebar .blog-posts-wrapper.column-1 article:nth-child(2n) .post-wrapper .entry-container {
        text-align: left;
    }
    .blog-posts-wrapper article.no-post-thumbnail .post-wrapper .entry-container {
        padding: 20px;
    }
    #top-menu .secondary-menu ul li {
        float: none;
        text-align: center;
        line-height: 40px;
    }
    #top-menu {
        cursor: pointer;
    }
    .secondary-menu {
        float: none;
        margin-bottom: 15px;
    }
    .social-menu {
        float: none;
        text-align: center;
    }
    #top-menu .social-menu ul li {
        float: none;
        display: inline-block;
    }
    .secondary-menu ul li:not(:last-child):after {
        display: none;
    }
    #top-menu .wrapper {
        display: none;
        padding-top: 30px;
        padding-bottom: 15px;
    }
    #top-menu:before {
        content: "";
        background-color: #ccc;
        position: absolute;
        top: 44px;
        width: 100%;
        left: 0;
        height: 1px;
    }
    .hentry:last-child {
        margin-bottom: 0;
    }
    #colophon .widget,
    #colophon .widget img {
        margin-left: auto;
        margin-right: auto;
    }
    #colophon .column-wrapper:not(:last-child) {
        margin-bottom: 30px;
        clear: both;
        display: table;
    }
    .textwidget img {
        max-width: 250px;
    }
    .copyright {
        margin-bottom: 10px;
    }
    .blog-posts-wrapper.column-3 article {
        width: 100%;
        float: left;
        padding: 0 10px;
    }
    .blog-posts-wrapper.column-3 article:nth-child(2n) {
        clear: left;
        width: 100%;
    }
    .blog-posts-wrapper.column-3 article:nth-child(2n+1) {
        clear: left;
        width: 100%;
    }
    .single-post article blockquote {
        padding: 25px;
    }
    #secondary #featured-posts .entry-container,
    #colophon #featured-posts .entry-container {
        padding: 5px 0 25px;
    }
}

@media screen and (max-width: 550px) {
    .column-4 article {
        width: 100%;
        padding: 0;
    }
    .custom-header-content h2 {
        line-height: 1;
    }
    .column-4 .custom-header-content h2 a,
    .column-3 .custom-header-content h2 a,
    .column-2 .custom-header-content h2 a,
    .custom-header-content h2 a {
        font-size: 30px;
    }
    .slick-prev,
    .slick-next {
        width: 40px;
        height: 40px;
    }
    .column-4 article:first-child {
        margin-bottom: 30px;
    }
    .blog-posts-wrapper.column-3 article {
        width: 100%;
        float: none;
        padding: 0;
    }
    header.page-header {
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 480px) {
    .entry-title {
        font-size: 22px;
    }
    .custom-header-content span {
        font-size: 14px;
    }
    #our-story .content-wrapper {
        padding: 25px;
    }
    .single-post article blockquote {
        padding: 25px 20px;
        font-size: 18px;
        line-height: 30px;
    }
}

@media screen and (max-width: 360px) {
    .site-branding img.custom-logo {
        max-width: 175px;
    }
    .textwidget img {
        max-width: 150px;
    }
}