/*
Theme Name: Apache
Theme URI:
Author: Red Clay Creative
Author URI: https://apachetheme.com
Description: The Apache Theme was created for Wordpress 5.0 and Gutenberg to make the website process easy for beginners and developers. Beginners can easily adjust the layout and developers can make modifications without adding lots of code. The end product is a simple, fast theme that is easy for clients to after publication - even if it's been customized by a developer. This also includes a child theme so that the base theme can be upgraded without messing with your customizations.
Version: 3.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: apache
Tags: custom-background, custom-colors, custom-header, custom-menu, custom-logo, theme-options, featured-images, microformats, post-formats, full-width-template, rtl-language-support, threaded-comments, translation-ready, left-sidebar, right-sidebar, blog, e-commerce
*/

/*
When editing styles below the Project Specific section, please add the phrase 'adjusted' below your adjustment
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS
----------------------------------------------------------------
# Basic Formatting
# Normalize
    ## Gutenberg
    ## Typography
    ## Black + White Colors
# Custom Elements
# Sidebar
# Forms
# Navigation
	## Menus
# Testimonial Slider
# Scrolling
    ## Scrollbar
# Media
	## Captions
# Accessibility
# Responsiveness & Mobile
# Effects
--------------------------------------------------------------*/

#hamburger,
.rcp_logged_in,
.popup,
.hide {
    display: none;
}


/*--------------------------------------------------------------
# Basic Formatting
--------------------------------------------------------------*/

body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    min-height: 100vh;
    overflow-x: hidden;
}


body.admin-bar,
body.admin-bar .masthead {
    margin-top: 32px !important;
}

body.admin-bar .masthead.ugh-admin-bar,
body.admin-bar .masthead #hamburger.ugh-admin-bar {
    margin-top: 0 !important;
}

body.admin-bar #wpadminbar {
    position: absolute;
    z-index: 1000000;
}

.masthead .navigate #popout {
    max-width: 100%;
    margin: 0;
}

.masthead .navigate #popout .top-menu {
    display: inline-block;
}

.masthead .navigate #popout #menu-primary {
    text-align: right;
}

#header-two #top .flexbox,
#header-two .navigate  {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

#header-two #top .flexbox #top-box {
    padding: 10px 15px;
}



#main .content {
    z-index: 1;
    width: 100%;
    max-width: 2000px;
    margin: 0 auto;
}

#main .post-title {
    margin-top: 70px;
}




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

html {
    margin-top: 0 !important;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
        -ms-text-size-adjust:     100%;
            -webkit-box-sizing: border-box;
                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/ */
	-webkit-box-sizing: inherit;
	   box-sizing: inherit;
}

body {
	margin: 0;
}

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

.post p a {
    color: #0A618F;
    text-decoration: underline;
}

a {
    text-decoration: none;
    color: inherit;
}

a:link {
    background-color: transparent;
}

a:-webkit-any-link {
    color: inherit;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li {
    padding-left: 10px;
    padding-bottom: 3px;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 10px;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 15px 15px;
}

figure {
	margin: 10px auto;
}

figcaption {
    font-style: italic;
    font-size: calc(7px + 0.5vw);
}

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

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

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

[hidden],
template {
	display: none;
}

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

b,
strong {
	font-weight: bold;
}

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 {
    display: block;
	border: 0;
}

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

pre {
	overflow: auto;
}

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

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;
}

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

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

input {
	line-height: normal;
}

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

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

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-spacing: 0;
}

td {
    padding: 0;
}

th {
    padding: 0;
}


/*--------------------------------------------------------------
## Gutenberg
--------------------------------------------------------------*/

/* Lists */
#main .post ul.wp-block-list,
#main .post ol.wp-block-list {
    margin: 0 auto 20px;
    padding: 0 30px 0 50px;
    max-width: 800px;
}

#main .post ul.is-style-checks {
    list-style-type: none;
}

#main .post ul.is-style-checks li::before {
    content: "\f00c";
    margin-left: -30px;
    padding: 0 10px 0 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}


/* Separator Block */
#main .post .wp-block-separator {
    margin-left: auto;
    margin-right: auto;
}

#main .post .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
    max-width: 100px;
}

#main .post .wp-block-separator.is-style-align-left {
    margin-left: 30px;
}

#main .post .wp-block-separator.is-style-align-right {
    margin-right: 30px;
}

#main .post .wp-block-separator.is-style-wide {
    width: calc(100% - 60px);
    max-width: 860px;
}

#main .post .wp-block-separator.is-style-dots {
    background: none !important;
}


/* Spacer Block */
#main .post .wp-block-spacer.is-style-five {
    height: 5px !important;
}

#main .post .wp-block-spacer.is-style-ten {
    height: 10px !important;
}

#main .post .wp-block-spacer.is-style-fifteen {
    height: 15px !important;
}

/* Quotes */
#main .post blockquote {
	margin: 0 auto 15px;
    padding: 0;
}

#main .post blockquote.wp-block-quote p {
    font-size: calc(12px + 0.5vw);
    line-height: 1.5;
}

#main .post blockquote.is-style-large p {
    font-size: calc(20px + 0.5vw);
}

#main .post cite {
    font-size: calc(12px + 0.5vw);
}

#main .post figure.wp-block-pullquote:not(.is-style-solid-color) {
    max-width: 800px;
    margin: 10px auto;
    border-top: 2px solid #222;
    border-bottom: 2px solid #222;
}

#main .post figure.wp-block-pullquote blockquote {
    margin-bottom: 0;
}

#main .post figure.wp-block-pullquote cite {
    text-transform: uppercase;
    font-style: inherit;
}

#main .post .wp-block-pullquote.is-style-solid-color blockquote p {
    margin-bottom: 15px;
}


/* Images */
#main .post .wp-block-gallery {
    margin: 25px auto 5px;
}

#main .post .wp-block-gallery ul {
    max-width: 880px;
    margin: 0 auto;
    padding: 0 30px;
    -webkit-transform: translateX(0);
        transform: translateX(0);
}

#main .post .wp-block-gallery ul li {
    padding: 0;
}

#main .post .wp-block-image {
    max-width: 850px;
    margin: 0 auto;
}

#main .post .wp-block-image img {
    height: auto;
}

.single #main .post .wp-block-image {
    margin: 25px auto;
}

#main .post .wp-block-image .alignleft,
#main .post .wp-block-image .alignright {
    max-width: 500px;
    margin-top: 0;
}

#main .post .wp-block-image .alignleft {
    margin-left: 30px;
}

#main .post .wp-block-image .alignright {
    margin-right: 30px;
}

#main .post .wp-block-image .alignleft img,
#main .post .wp-block-image .alignright img {
    margin: 0;
}

#main .post .wp-block-image.alignfull {
    max-width: 100%;
    padding: 0;
}


/* Inline Image */
#main .post p img {
    float: left;
    margin-right: 1em;
}


/* Video */
#main .post .wp-block-video {
    max-width: 860px;
    margin: 15px auto;
    padding: 0 30px;
}


/* Columns */
#main .post .wp-block-columns {
    margin-bottom: 0;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

#main .post .wp-block-column {
    margin: 0;
}

#main .post .wp-block-columns figure {
    margin: 0 auto;
}

#main .post .has-1-columns .wp-block-column {
    -ms-flex-preferred-size: inherit;
        flex-basis: inherit;
}

/* Old Column Settings */
/* #main .post .has-2-columns .wp-block-column,
#main .post .wp-block-columns .wp-block-column:first-child:nth-last-child(2),
#main .post .wp-block-columns .wp-block-column:first-child:nth-last-child(2) ~ .wp-block-column {
    flex-basis: 50%;
    max-width: 600px;
}

#main .post .has-3-columns .wp-block-column,
#main .post .wp-block-columns .wp-block-column:first-child:nth-last-child(3),
#main .post .wp-block-columns .wp-block-column:first-child:nth-last-child(3) ~ .wp-block-column {
    flex-basis: 33.33%;
    max-width: 400px;
    margin-left: 0;
    -ms-flex-preferred-size: calc(33.33%);
        flex-basis: calc(33.33%);
}

#main .post .has-3-columns .wp-block-column:nth-child(3n) {
    margin-right: 0;
}

#main .post .has-4-columns {
    max-width: 1250px;
    margin: 0 auto;
}

#main .post .has-4-columns .wp-block-column,
#main .post .wp-block-columns .wp-block-column:first-child:nth-last-child(4),
#main .post .wp-block-columns .wp-block-column:first-child:nth-last-child(4) ~ .wp-block-column {
    -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    -webkit-box-flex: 0;
        -ms-flex-positive: 0;
            flex-grow: 0;
    max-width: 312.5px;
    margin: 0;
} */

#main .post .wp-block-columns {
    max-width: 960px;
    margin: 0 auto;
}

#main .post .wp-block-columns.alignwide {
    max-width: 1200px;
    margin: 0 auto;
}

#main .post .wp-block-columns.alignfull {
    width: 100%;
}

#main .post .wp-block-columns.is-style-spaced {
    margin-bottom: -30px;
}

#main .post .wp-block-columns > *:last-child,
#main .post .wp-block-columns.is-style-spaced .wp-block-column > *:last-child {
    margin-bottom: 0;
}

#main .post .wp-block-columns.is-style-spaced .wp-block-column {
    padding-top: 29px;
    padding-bottom: 30px;
    margin-right: 30px;
    margin-bottom: 30px;
}

#main .post .wp-block-columns.is-style-spaced .wp-block-column:first-of-type {
    margin-left: 30px;
}


/* Group Block */
#main .post .wp-block-group {
    max-width: 500px;
    margin: 0 auto;
}

#main .post .wp-block-group.alignwide {
    max-width: 1200px;
}

#main .post .wp-block-group .wp-block-group__inner-container {
    height: inherit;
}

/* Cover Block */
#main .post .wp-block-cover,
#main .post .wp-block-cover-image {
    margin: 0;
}

#main .post .wp-block-cover.alignwide {
    max-width: 1200px;
    margin: 0 auto;
}

#main .post .wp-block-cover .wp-block-cover__inner-container {
    width: 100%;
}

#main .post .wp-block-cover .wp-block-cover__inner-container a {
    text-decoration: none;
}

#main .post .wp-block-cover.is-style-full-height {
    min-height: 100vh;
}

#main .post .wp-block-cover.is-style-full-height .wp-block-cover__inner-container,
#main .post .wp-block-cover.is-style-full-height h1,
#main .post .wp-block-cover.is-style-stretch-content h1,
#main .post .wp-block-cover.is-style-full-height h2,
#main .post .wp-block-cover.is-style-stretch-content h2,
#main .post .wp-block-cover.is-style-full-height h3,
#main .post .wp-block-cover.is-style-stretch-content h3,
#main .post .wp-block-cover.is-style-full-height h4,
#main .post .wp-block-cover.is-style-stretch-content h4,
#main .post .wp-block-cover.is-style-full-height h5,
#main .post .wp-block-cover.is-style-stretch-content h5,
#main .post .wp-block-cover.is-style-full-height p,
#main .post .wp-block-cover.is-style-stretch-content p,
#main .post .wp-block-cover.is-style-full-height .wp-block-buttons,
#main .post .wp-block-cover.is-style-stretch-content .wp-block-buttons {
    max-width: 1000px;
}

#main .post .wp-block-columns .wp-block-cover {
    height: auto;
}

#main .post .wp-block-columns.is-style-spaced .wp-block-cover {
    height: auto;
}

#main .post .wp-block-group.has-background .wp-block-group__inner-container > *:last-child,
#main .post .wp-block-columns.has-background .wp-block-column > *:last-child {
    margin-bottom: 0;
}



/* Button Block */
#main .post .wp-block-buttons {
  max-width: 860px;
  margin: 0 auto;
}

#main .post .wp-block-buttons.alignleft {
    text-align: left;
    justify-content: flex-start;
}

#main .post .wp-block-buttons.alignright {
    text-align: right;
    justify-content: flex-end;
}

#main .post .wp-block-buttons.aligncenter {
    justify-content: center;
}

#main .post .wp-block-buttons .aligncenter {
    margin-left: initial;
    margin-right: initial;
}

#main .post .wp-block-buttons .wp-block-button {
    margin-bottom: 0;
}

#main .post .wp-block-buttons .wp-block-button {
    margin-right: 15px;
}

#main .post .wp-block-buttons .wp-block-button:last-of-type {
    margin-right: 0;
}

#main .post .wp-block-button .wp-block-button__link {
    text-decoration: none;
    -webkit-transition: 0.5s all ease;
        transition: 0.5s all ease;
    -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
        box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
}

#main .post .wp-block-button .wp-block-button__link:hover {
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25);
        box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25);
}


/* Media & Text Block
#main .post .wp-block-media-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

#main .post .wp-block-media-text .wp-block-media-text__media,
#main .post .wp-block-media-text .wp-block-media-text__content {
    width: 50%;
    max-width: 560px;
}
*/
#main .post .wp-block-media-text {
    min-height: 400px;
    max-width: 860px;
    margin: 0 auto;
}

#main .post .wp-block-media-text.alignwide {
    max-width: 1200px;
}

#main .post .wp-block-media-text .wp-block-media-text__content {
    max-width: 700px;
    margin: 0 auto;
    padding: 30px 0;
}
/*
#main .post .wp-block-media-text .wp-block-media-text__content > *:last-child{
    margin-bottom: 0;
}

#main .post .wp-block-media-text.alignfull .wp-block-media-text__media,
#main .post .wp-block-media-text.alignfull .wp-block-media-text__content {
    max-width: none;
}

#main .post .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
}

#main .post .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
    -webkit-box-ordinal-group:2;
        -ms-flex-order: 1;
            order: 1;
}
*/

/* Table Block */
#main .post .wp-block-table {
    max-width: 800px;
    margin: 10px auto 30px;
    padding: 0 30px;
}

#main .post .wp-block-table table {
    border: 1px solid #222;
}

#main .post .wp-block-table tr th {
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
}

#main .post .wp-block-table tr th:first-of-type {
    border-left: 1px solid #222;
}

#main .post .wp-block-table tr th:last-of-type {
    border-right: 1px solid #222;
}

#main .post .wp-block-table tbody tr td {
    border: 1px solid #222;
    padding: 10px;
}

#main .post .wp-block-table.is-style-stripes {
    border: none;
    border-bottom: 1px solid #f3f4f5;
}

#main .post .wp-block-table.is-style-stripes tbody tr td {
    border: none;
}

#main .post .wp-block-table.alignleft,
#main .post .wp-block-table.alignright {
    display: block;
    max-width: 800px;
    margin: 0 auto;
    border: none;
}

#main .post .wp-block-table.alignleft tbody {
    float: left;
    margin-right: 1em;
}

#main .post .wp-block-table.alignright tbody {
    float: right;
    margin-left: 1em;
}

#main .post .wp-block-table.alignleft tbody tr:last-of-type td,
#main .post .wp-block-table.alignright tbody tr:last-of-type td {
    border-bottom: 1px solid #f3f4f5;
}


/* Embed Blocks */
#main .post .wp-block-embed iframe {
    margin: 0 auto !important;
}

#main .post audio {
    width: calc(100% - 60px);
    margin: 10px 25px 15px;
}

#main .post .wp-block-embed-youtube {
    width: 100%;
    max-width: 860px;
    margin: 0 auto 20px;
    padding: 0 30px;
}


/* File Block */
#main .post .wp-block-file {
    margin: 30px auto;
    text-align: center;
}


/* Other Stuff */
.flex-zero {
    -webkit-box-flex: 0;
        -ms-flex: 0;
            flex: 0;
}

.aligncenter {
    margin-left: auto;
    margin-right: auto;
}

.alignfull {
    max-width: none !important;
}

/* Similar Stuff */
#main .post pre,
#main .post blockquote,
#main .post ul.wp-block-gallery,
#main .post figure.wp-block-audio,
#main .post .wp-block-button {
    max-width: 860px;
}

#main .post pre {
    margin: 15px auto;
}

#main .post h1,
#main .post h2,
#main .post h3,
#main .post h4,
#main .post h5,
#main .post h6,
#main .post p,
#main .post pre,
#main .post cite,
#main .post ul.wp-block-gallery,
#main .post figure.wp-block-audio,
#main .post div.wp-block-buttons {
    padding: 0 30px;
}

#main .post .wp-block-group.has-background,
#main .post .wp-block-columns.has-background {
    padding: 30px 0;
}


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

body,
button,
input,
select,
textarea {
	color: #404040;
    font-family: 'Open Sans', sans-serif; /* Default */
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
    margin-top: 0;
    font-family: 'Open Sans', sans-serif; /* Default */
    font-weight: normal;
    max-width: 860px;
    margin: 0 auto 15px;
}

/* adjust according to project and responsiveness */
h1 {
    font-size: calc(30px + 0.5vw);
}

h2 {
    font-size: calc(25px + 0.5vw);
    margin-bottom: 15px;
}

h3 {
    font-size: calc(20px + 0.5vw);
    margin-bottom: 15px;
}

h4 {
    font-size: calc(15px + 0.5vw);
    margin-bottom: 0;
}

h5 {
    font-size: calc(12px + 0.5vw);
    margin-bottom: 0;
}

h6 {
    font-size: medium;
    margin-bottom: 0;
}

p {
    margin: 0 auto 15px;
    max-width: 860px;
}

.left {
    text-align: left !important;
}

.right {
    text-align: right !important;
}

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

big {
	font-size: 125%;
}

address {
	margin: 0 0 15px;
}

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

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


/*--------------------------------------------------------------
## Black + White Colors
--------------------------------------------------------------*/
/* add colors for fonts and backgrounds according to project */

.f-white,
.has-white-color,
.has-white-color-hover:hover,
.has-white-background-color #cart .token,
#main .f-has-white-label-color form label,
#main .f-has-white-color form input,
#main .f-has-white-color form textarea,
#main .f-has-white-button-color form input[type="submit"],
#main .f-has-white-button-color form input[type="button"] {
    color: #fff !important;
}

#main .f-has-white-color form input::-webkit-input-placeholder,
#main .f-has-white-color form textarea::-webkit-input-placeholder {
    color: #FFFFFFB3 !important;
}

.has-white-color h1,
.has-white-color h2,
.has-white-color h3,
.has-white-color h4,
.has-white-color h5,
.has-white-color h6,
.has-white-color p,
.sub-has-white-color .sub-menu a {
    color: #fff;
}

.white,
#has-white-background-color,
.has-white-background-color,
#has-white-background-color-hover:hover,
.has-white-background-color-hover:hover,
.has-white-background-color .dotted,
.has-white-color #cart .token,
#main .f-has-white-background-color form,
#main .f-has-white-input-color form input,
#main .f-has-white-input-color form textarea,
#main .f-has-white-button-background-color form input[type="submit"],
#main .f-has-white-button-background-color form input[type="button"],
#main .f-has-white-color form input[type="checkbox"]:checked,
#main .f-has-white-color form input[type="radio"]:checked {
    background-color: #fff !important;
}

.has-white-background-color.dot {
    border: 1px solid #fff;
}

#main .f-has-white-border-color form input,
#main .f-has-white-border-color form textarea {
    border-bottom: 1.5px solid #fff !important;
}

#main .f-has-white-border-color form input[type="checkbox"],
#main .f-has-white-border-color form input[type="radio"] {
    border: 1.5px solid #fff !important;
}

.f-black,
.has-black-color,
.has-black-color-hover:hover,
.has-black-background-color #cart .token,
#main .f-has-black-label-color form label,
#main .f-has-black-color form input,
#main .f-has-black-color form textarea,
#main .f-has-black-button-color form input[type="submit"],
#main .f-has-black-button-color form input[type="button"] {
    color: #222 !important;
}

#main .f-has-black-color form input::-webkit-input-placeholder,
#main .f-has-black-color form textarea::-webkit-input-placeholder {
    color: #222222B3 !important;
}

.has-black-color h1,
.has-black-color h2,
.has-black-color h3,
.has-black-color h4,
.has-black-color h5,
.has-black-color h6,
.has-black-color p,
.sub-has-black-color .sub-menu a {
    color: #222;
}

.black,
#has-black-background-color,
.has-black-background-color,
#has-black-background-color-hover:hover,
.has-black-background-color-hover:hover,
.has-black-background-color .dotted,
.has-black-color #cart .token,
#main .f-has-black-background-color form,
#main .f-has-black-input-color form input,
#main .f-has-black-input-color form textarea,
#main .f-has-black-button-background-color form input[type="submit"],
#main .f-has-black-button-background-color form input[type="button"],
#main .f-has-black-color form input[type="checkbox"]:checked,
#main .f-has-black-color form input[type="radio"]:checked {
    background-color: #222 !important;
}

.has-black-background-color.dot {
    border: 1px solid #222;
}

#main .f-has-black-border-color form input,
#main .f-has-black-border-color form textarea {
    border-bottom: 1.5px solid #222 !important;
}

#main .f-has-black-border-color form input[type="checkbox"],
#main .f-has-black-border-color form input[type="radio"] {
    border: 1.5px solid #222 !important;
}




/*--------------------------------------------------------------
# Custom Elements
--------------------------------------------------------------*/
/* You can add these classes to elements for standard formatting */

#main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    margin: 0 auto;
    -webkit-transition: 0.3s all ease;
        transition: 0.3s all ease;
}

.sticky {
    /* Not sure what to do with this class */
}

/* Add this to any element to control max-width */
.page-control {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
}

.content-block {
    padding: 30px;
}

.content-block-less {
    padding: 20px;
}

/* Create your own table */
.table {
    display: table;
    position: relative;
    width: 100%;
    border-collapse: collapse;
}

.row {
    display: table-row;
    padding: 0;
}

.cell {
    display: table-cell;
    vertical-align: middle;
}

/* align items in a cell to the top */
.top {
    vertical-align: top !important;
}

/* you do not need to define the direction unless you want to */
.flexbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

/* use this class inside of .flexbox and change flex-basis to adjust the width of your content */
.flex-field {
    -ms-flex-preferred-size: 31%;
    flex-basis: 31%;
    margin: 0 1% 20px;
}

.one {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
}

.two {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
}

.twos {
    position: relative;
    width: 50%;
}

.threes {
    position: relative;
    width: 33.33%;
}

.fours {
    position: relative;
    width: 25%;
}

/* adjust height or width to needs and add background color with project created class in html or php file */
hr {
	-webkit-box-sizing: border-box;
	   box-sizing: border-box;
	border: 0;
	height: 1px;
    width: calc(100% - 60px);
	margin: 15px auto;
    background-color: #000;
}

.bottom {
    margin-bottom: 0 !important;
}

/* You can use this class instead of <button> */
.click {
    z-index: 100;
    display: inline-block;
    margin: 0 auto;
    /* border: 2px solid #fff; */
/* adjust rounded corners according to project */
    /*border-radius: 5px;*/
    padding: 10px 15px;
    cursor: pointer;
}

/* standard popup */
.popup {
    z-index: 1000000;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    margin: 10vh auto;
    width: 80vw;
    max-width: 930px;
    /*height: 100%;*/
    max-height: 80vh;
    -webkit-transition: opacity 1s ease;
        transition: opacity 1s ease;
}

.popup .popup-wrapper {
    position: relative;
    height: 100%;
    max-height: 80vh;
    width: 100%;
    border-top: 40px solid #fff;
    border-bottom: 40px solid #fff;
    border-left: 50px solid #fff;
    border-right: 50px solid #fff;
}

/* this affects the close "button" on popups */
.ex {
    z-index: 1000;
    position: absolute;
	top: 40px;
    right: 40px;
    border-radius: 100%;
    width: calc(35px + 0.5vw);
    height: calc(35px + 0.5vw);
	cursor: pointer;
}

.ex div {
    position: relative;
    width: 100%;
    height: 100%;
}

.ex span {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
	font-size: calc(25px + 0.5vw);
}

.popup-1,
.popup-2,
.popup-3,
.popup-4,
.popup-5,
.popup-6,
.popup-7,
.popup-8,
.popup-9,
.popup-10 {
/* anything more than this you can figure out */
    cursor: pointer;
}

#map {
    height: 500px;
    width: 100%;
}




/*--------------------------------------------------------------
# Sidebar
--------------------------------------------------------------*/

.global-side .post {
    float: left;
    width: 70%;
}

.global-side .sidebar {
    float: left;
    width: 30%;
}

.global-side .global-side-right.post {
    float: left;
    width: 70%;
}

.side .side-right.post {
    float: left;
    width: 70%;
}

.global-side .global-side-left.post {
    float: right;
    width: 70%;
}

.side .side-left.post {
    float: right;
    width: 70%;
}

.side .sidebar {
    float: left;
    width: 30%;
}

.global-side.no-side .post {
    float: inherit;
    width: inherit;
}

.global-side.no-side .sidebar {
    display: none;
}

.side .sidebar-content {
    max-width: 500px;
}

.side .sidebar-content p:last-child,
.side .sidebar-content ul:last-child,
.side .sidebar-content ol:last-child {
    margin-bottom: 0;
}




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

fieldset {
	margin: 0 auto;
	padding: 20px;
}

textarea {
	width: 100%;
    resize: none;
    overflow: hidden;
}

input,
textarea {
    background: rgba(255, 255, 255, 0) !important;
    width: 100% !important;
    padding: 10px;
    margin: 0;
    border: none !important;
    border-radius: 0 !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
    -webkit-transition: all 0.5s ease;
        transition: all 0.5s ease;
}

input:focus,
textarea:focus {
    -webkit-box-shadow: 0px 9px 10px -8px rgba(0, 0, 0, 0.33) !important;
        box-shadow: 0px 9px 10px -8px rgba(0, 0, 0, 0.33) !important;
    outline: 0 !important;
}

input[type="checkbox"],
input[type="radio"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 13px !important;
    width: 13px !important;
    padding: 5px;
    background-color: #fff !important;
    cursor: pointer;
}

input[type="radio"] {
    border-radius: 100% !important;
}



/* Contact Forms */
#main .post form {
    max-width: 450px;
    margin: 0 auto 30px;
    padding: 35px 30px 20px;
}

#main .post form p {
    padding: 0;
}

#main .post form ul {
    -webkit-transform: translateX(0);
        transform: translateX(0);
}

#main .post form ul li {
    margin-bottom: 15px;
    padding: 0;
}

#main .post .wpuf-el.recaptcha {
    margin-bottom: 0;
}

#main .post input[type="submit"],
#main .post input[type="button"] {
    width: inherit !important;
    border: none !important;
    padding: 10px 20px;
    text-shadow: none;
    font-size: calc(15px + 0.5vw);
    line-height: 1;
    -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25) !important;
        box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25) !important;
}


/* Ninja Forms */
#main .post .nf-form-title h3 {
    max-width: 450px;
}

#main .post form .nf-form-content {
    margin-top: 20px;
}

#main .post form #ninja_forms_required_items,
#main .post form .nf-field-container {
    margin-bottom: 15px;
}

#main .post form .nf-field-element textarea {
    height: inherit;
}

#main .post form .list-checkbox-wrap .nf-field-label label,
#main .post form .checkbox-wrap .nf-field-label label,
#main .post form .listradio-container .nf-field-label label {
    display: block !important;
}

#main .post form .list-checkbox-wrap li label,
#main .post form .checkbox-wrap li label,
#main .post form .listradio-container li label {
    display: inline-block;
    margin-left: 6px;
}

#main .post form input[type="checkbox"],
#main .post form input[type="radio"] {
    width: 13px !important;
}

#main .post .submit-wrap .nf-field-element {
    width: inherit;
}


/* Contact Form 7 */
#main .post .wpcf7 form label input,
#main .post .wpcf7 form label textarea {
    margin-top: 7px;
}


/* WeForms */
#main ul.wpuf-form .voila .wpuf-label,
#main ul.wpuf-form .voila .wpuf-label label {
    display: block;
    margin-bottom: 3px;
}

#main ul.wpuf-form .help .wpuf-help {
    display: block;
}

#main ul.wpuf-form li .wpuf-fields .wpuf-name-field-wrap {
    margin-bottom: 0;
}

#main ul.wpuf-form li .wpuf-label {
    width: 100%;
}

#main ul.wpuf-form li[data-label="Checkbox"] label,
#main ul.wpuf-form li[data-label="Radio"] label,
#main ul.wpuf-form li [data-type="radio"] label {
    display: block;
    font-weight: normal;
}

#main ul.wpuf-form li [data-type="radio"] label.wpuf-checkbox-inline {
    display: inline-block;
}

#main ul.wpuf-form li .wpuf-fields .wpuf-checkbox-block,
#main ul.wpuf-form li .wpuf-fields .wpuf-radio-block {
    display: inline-block;
    margin-right: 6px;
}

#main ul.wpuf-form li .wpuf-fields .wpuf-help {
    display: none;
}

#main ul.wpuf-form li.help-me .wpuf-fields .wpuf-help {
    display: block;
}

#main ul.wpuf-form li.checkbox {
    font-weight: normal;
}

#main .wpuf-success {
    margin: 10px auto 20px;
    max-width: 450px;
}

/* Gravity Forms */
.gform_wrapper form .gfield {
    margin-bottom: 10px;
}

.gform_wrapper form .hidden_label label {
    display: none !important;
}



/* Form Placeholder Styling */
/* #main ul.wpuf-form li .wpuf-label,
#main ul.wpuf-form li .wpuf-fields .wpuf-radio-block,
#main ul.wpuf-form li .wpuf-fields .wpuf-checkbox-block {
    color: #ffffff80;
}

#main input::-webkit-input-placeholder,
#main textarea::-webkit-input-placeholder {
    color: #dbdbdb !important;
}

#main input:-ms-input-placeholder,
#main textarea:-ms-input-placeholder {
    color: #dbdbdb !important;
}

#main input::placeholder,
#main textarea::placeholder {
    color: #dbdbdb !important;
} */

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/

/* it may be helpful to define height here depending on project */
.masthead {
    z-index: 1000000;
    position: fixed;
    top: 0;
    width: 100%;
}

.masthead .foot {
    max-width: inherit;
    padding: 7px 15px;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}

.masthead .reverse {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}

.masthead .navigate {
    padding-left: 50px;
    padding-right: 50px;
}

#header-one.masthead .navigate.nav-left {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}

#header-two.masthead .navigate.nav-left {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
}

.masthead .navigate.nav-center {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

#header-one.masthead .navigate.nav-right {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
}

#header-two.masthead .navigate.nav-right {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}

#popout .menu ul {
    margin: 0;
    padding: 0;
}

footer {
    z-index: 1001;
    width: 100%;
}

footer .main-footer {
    padding: 20px;
}

footer #bottom {
    padding-left: 20px;
    padding-right: 20px;
}

footer a {
    text-decoration: underline;
}

footer .flexbox {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}

footer .foot {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}

footer #bottom .foot {
    padding: 10px;
}

.masthead .social {
    padding: 7px 5px 3.5px;
}

footer .social {
    padding: 5px 5px 0.5px;
}

.social .social-icons {
	display: inline-block;
    margin-right: 5px;
}

.masthead .social .social-icons img {
    width: inherit;
    max-width: 30px;
}

footer .social .social-icons img {
    width: inherit;
    max-width: 40px;
}


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

.menu {
    margin: 0 auto;
    padding: 0;
    text-align: center;
    -webkit-transform: translateX(0);
        transform: translateX(0);
}

.menu-item,
.page_item {
    display: inline-block;
    padding: 0;
}

.menu-item a,
.page_item a {
    display: inline-block;
    padding: 15px;
}

.menu-item-has-children {
	position: relative;
}

.menu-item-has-children:hover .sub-menu,
.menu-item-has-children.hover .sub-menu {
    display: block;
}

.sub-menu {
    z-index: 1001;
    display: none;
    position: absolute;
    margin: 0 !important;
/* may have to adjust min-width depending on project */
    min-width: 160px;
/* background color will depend on project */
/* shadow may or may not need to be adjusted */
    -webkit-box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}

.sub-menu li {
    float: left;
    clear: left;
    width: 100%;
    text-align: left;
    background-color: #fff;
}

.sub-menu a {
    display: block;
    text-decoration: none;
    padding: 10px 15px;
}

.sub-menu li:first-of-type a {
    margin-top: 10px;
}

.sub-menu li:last-of-type a {
    margin-bottom: 10px;
}

.masthead .sub-menu .sub-menu {
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	-webkit-transform: translatex(100%);
    transform: translatex(100%);
}

.masthead .sub-menu .menu-item-has-children:hover .sub-menu {
	display: block;
}


/*--------------------------------------------------------------
# Testimonial Slider
--------------------------------------------------------------*/

.testimonial-slider {
	position: relative;
	width: auto;
	overflow: hidden;
}

#left-step {
	display: inline-block;
	margin-right: 3px;
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
	border-right:10px solid #fff;
	cursor: pointer;
}

#right-step {
	display: inline-block;
	margin-left: 3px;
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
	border-left:10px solid #fff;
	cursor: pointer;
}

.test-slide {
	display: block;
    opacity: 0;
	position: absolute;
    max-width: 1000px;
	margin: 0 auto;
    top: 50%;
    left: 50%;
	-webkit-transform: translate(-100vw, -50%);
		transform: translate(-100vw, -50%);
	-webkit-transition: 1s ease all;
		transition: 1s ease all;
}

.move,
.test-slide.move {
	-webkit-transform: translate(-50%, -50%) !important;
		transform: translate(-50%, -50%) !important;
	opacity: 1 !important;
}


/*--------------------------------------------------------------
# Scrolling
--------------------------------------------------------------*/

.y-scroll {
    overflow-y: auto;
}

.x-scroll {
    overflow-x: scroll;
}

/*  use this for user experience to show the direction of scrolling or point the user in the proper direction - adjust accordingly */
.fade-arrow {
    position: absolute;
    top: 0;
    right: 20px;
    bottom: 0;
    height: 50px;
    margin: auto;
    width: auto;
}

/* put this class in div where you will be scrolling to (refer to HTML reference for div and JS Reference for function) */
.scroll-to {
    display: block;
/* adjust height and margin to be equal - these should be the same height as the masthead */
    margin-top: -100px;
    height: 100px;
    width: 100%;
    pointer-events: none;
}

.s {
    -webkit-transition: all 0.7s linear;
        transition: all 0.7s linear;
}

/* this class allows you to add fade effect to an object (usually masthead) in conjunction with jQuery function */
.scrolled {
    background-color: rgba(255, 255, 255, 0.8);
    -webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.2);
}




/*--------------------------------------------------------------
# Scrollbar
--------------------------------------------------------------*/

/* change background of scrollbar track */
/* body::-webkit-scrollbar-track,
.y-scroll::-webkit-scrollbar-track,
.x-scroll::-webkit-scrollbar-track {
	background-color: #F3F3F3;
} */

/* keep height and width the same size */
/* body::-webkit-scrollbar,
.y-scroll::-webkit-scrollbar,
.x-scroll::-webkit-scrollbar{
	width: 10px;
    height: 10px;
	background-color: #F3F3F3;
} */

/* you can change the color of the scrollbar here */
/* body::-webkit-scrollbar-thumb,
.y-scroll::-webkit-scrollbar-thumb,
.x-scroll::-webkit-scrollbar-thumb {
	background-color: #A18276;
} */




/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/

/* ensures embeds and iframes fit their containers. */
embed,
iframe,
object {
    display: block;
    margin: 0 auto;
	max-width: 100%;
}

/* padding is most important aspect here */
.youtube {
    background-color: #000;
    position: relative;
    z-index: 1;
    padding-top: 56.25%;
    overflow: hidden;
    cursor: pointer;
}

.youtube img {
    width: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    opacity: 0.7;
}

.youtube .play-button {
    width: 90px;
    height: 60px;
    background-color: #333;
    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
        box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
    z-index: 1;
    opacity: 0.8;
    border-radius: 6px;
}

.youtube .play-button:before {
    content: "";
    border-style: solid;
    border-width: 15px 0 15px 26.0px;
    border-color: transparent transparent transparent #fff;
}

.youtube img,
.youtube .play-button {
    cursor: pointer;
}

.youtube img,
.youtube iframe,
.youtube .play-button,
.youtube .play-button:before {
    position: absolute;
}

.youtube .play-button,
.youtube .play-button:before {
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
        transform: translate3d(-50%, -50%, 0);
}

.youtube iframe {
    z-index: 10;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}


/*--------------------------------------------------------------
## 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;
}

.gallery-caption {
    /* Do nothing */
}

.bypostauthor {
    /* Do nothing */
}

/*--------------------------------------------------------------
# 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;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	-webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	   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;
}




/*--------------------------------------------------------------
# Mobile
--------------------------------------------------------------*/

/*
Test Code for overhanging items in mobile
* {
  background: #000 !important;
  color: #0f0 !important;
  outline: solid #f00 1px !important;
}
*/

@media screen and (max-width: 782px) {

    body.admin-bar,
    body.admin-bar .masthead,
    body.admin-bar .masthead #hamburger {
        margin-top: 46px !important;
    }

}

@media screen and (max-width: 699px) {

/* add this class to have object adjust to phone screens */
    #main .post .wp-block-media-text .wp-block-media-text__media,
    #main .post .wp-block-media-text .wp-block-media-text__content,
    .mobile {
        display: inline-block !important;
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        -webkit-box-flex: 1;
            -ms-flex: auto;
                flex: auto;
    }

    .mobile-none {
        display: none !important;
    }

    #main .post .wp-block-column {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
    }

    #main .post .wp-block-columns.is-style-spaced .wp-block-column {
        margin-left: 30px;
    }

    .m-one {
        -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
    }

    .m-two {
        -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
                order: 2;
    }

    .lock {
        background-attachment: scroll !important;
    }

    .masthead .navigate {
        padding-left: 30px;
        padding-right: 30px;
    }

    .navigate .custom-logo,
    .woocommerce .navigate .custom-logo,
    .woocommerce-page .navigate .custom-logo {
        height: 60px;
        margin: 5px 0;
        width: auto;
    }

    .menu-item,
    .page_item,
    .menu_item {
        width: 100%;
    }

    .page_item a,
    .menu-item a {
        width: 100%;
        text-align: center;
    }

    #header-one.masthead .navigate.m-nav-left,
    #header-two.masthead .navigate.m-nav-left {
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
    }

    #header-one.masthead .navigate.m-nav-right,
    #header-two.masthead .navigate.m-nav-right {
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
    }

    .masthead .foot {
        text-align: center !important;
    }

    #hamburger.m-nav-left {
        left: 15px;
    }

    #hamburger.m-nav-right {
        right: 15px;
    }

    /* Hamburger Menu */
    #hamburger {
        z-index: 10000;
        display: inline-block;
        position: fixed;
        height: 50px;
        width: 50px;
        top: 10px;
        cursor: pointer;
        -webkit-transition: 1s all ease;
            transition: 1s all ease;
    }

    #hamburger div {
        position: relative;
        height: 100%;
        width: 100%;
    }

    #hamburger div span {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
        height: auto;
        width: 35px;
    }

    #hamburger .bar {
        display: block;
        margin: 5px auto;
        border-radius: 2.5px;
        height: 5px;
        -webkit-transition: 1s all ease;
        transition: 1s all ease;
    }

    /* this is for the mobile navigation menu     */
    #popout {
        position: fixed;
        z-index: 10000;
        overflow-y: auto;
        top: 0;
        right: -800px;
        height: 100vh;
        width: 100%;
        color: white;
    }

    #popout .top-menu {
        width: 100%;
        margin-bottom: 110px;
    }

    #popout .menu ul {
        margin: 0;
    }

    #popout .menu .sub-menu {
        /* display: block;
        position: relative; */
        width: 100%;
        margin: 0 !important;
        -webkit-transform: translateX(0);
            transform: translateX(0);
    }

    #popout .menu a:hover {
        background-color: #fff;
    }

    #popout .menu-item-has-children:last-child .sub-menu li:last-child {
        margin-bottom: 150px;
    }

    .menu-animate {
        opacity: 0;
        -webkit-transform: translateY(100px);
                transform: translateY(100px);
    }

    .menu-animate-now {
        opacity: 1;
        -webkit-transform: translateY(0) !important;
            transform: translateY(0) !important;
    }

    .swoosh {
        top: calc(100vh - 100px) !important;
        right: 50% !important;
        -webkit-transform: translateX(50%);
                transform: translateX(50%);
    }

    .ham-top {
        -webkit-transform: rotateZ(45deg) translate(8px, 8.5px);
                transform: rotateZ(45deg) translate(8px, 8.5px);
    }

    .ham-middle {
        -webkit-transform: rotateZ(45deg) translate(1.5px, 1.5px);
                transform: rotateZ(45deg) translate(1.5px, 1.5px);
    }

    .ham-bottom {
        -webkit-transform: rotateZ(-45deg) translate(5.5px, -5.5px);
                transform: rotateZ(-45deg) translate(5.5px, -5.5px);
    }

    .m-has-black-color a,
    .m-has-black-color-hover a:hover,
    .m-has-black-color-hover .sub-menu a {
        color: #222 !important;
    }

    .m-has-black-color .ham-top,
    .m-has-black-color .ham-middle,
    .m-has-black-color .ham-bottom {
        background-color: #222 !important;
    }

    .m-has-white-color a,
    .m-has-white-color-hover a:hover,
    .m-has-white-color-hover .sub-menu a {
        color: #fff !important;
    }

    .m-has-white-color .ham-top,
    .m-has-white-color .ham-middle,
    .m-has-white-color .ham-bottom {
        background-color: #fff !important;
    }



    #header-two #top .flexbox {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

    #header-two #top .flexbox #top-box h3 {
        font-size: calc(15px + 0.5vw);
    }



    #main .post .wp-block-image .alignleft,
    #main .post .wp-block-image .alignright {
        float: none;
    }

    #main .post .wp-block-image figure {
        margin: 0 auto 15px;
        padding: 0 30px;
    }

    #main .post table.wp-block-table {
        margin: 30px;
        max-width: calc(100% - 60px);
    }

    #main .post .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
        -webkit-box-ordinal-group:2;
            -ms-flex-order: 1;
                order: 1;
    }

    #main .post .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
        -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
                order: 2;
    }



    footer .main-footer,
    footer #bottom {
        padding-left: 0;
        padding-right: 0;
    }

    footer .foot {
        -webkit-box-flex: 1;
            -ms-flex: auto;
                flex: auto;
        padding-bottom: 0;
    }

    footer .foot:last-of-type {
        padding-bottom: 30px;
    }

    footer #bottom .foot {
        text-align: center !important;
    }

    footer #bottom .foot:nth-of-type(2) {
        padding-top: 0;
    }



    .popup {
        width: 100vw;
        max-height: 100vh;
        margin: 0;
    }

    .popup .popup-wrapper {
        max-height: 100vh;
        border-left: 30px solid #fff;
        border-right: 30px solid #fff;
    }

}

@media screen and (max-width: 600px) {

    #wpadminbar {
        top: -100px;
    }

    body.admin-bar,
    body.admin-bar .masthead,
    body.admin-bar .masthead #hamburger {
        margin-top: 0 !important;
    }

}


/*--------------------------------------------------------------
# Effects
--------------------------------------------------------------*/

/* standard box shadow */
.shadow {
    -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
        box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
}
.wp-block-image.shadow {
    -webkit-box-shadow: none;
        box-shadow: none;
}
.wp-block-image.shadow img {
    -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
        box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
}

/* box shadow with large blur effect */
.big-shadow {
    -webkit-box-shadow: 0px 30px 50px 0px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 30px 50px 0px rgba(0, 0, 0, 0.2);
}

/* text shadow for text above pictures */
.t-shadow {
    text-shadow: 0px 1px 3px rgba(0,0,0,0.5);
}

.perspective {
    -webkit-perspective: 2px;
        perspective: 2px;
    -webkit-transform: translateZ(0);
        transform: translateZ(0);
}

.parallax {
    position: absolute;
    top: -300px;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transform: translateZ(-1px) scale(1.5);
        transform: translateZ(-1px) scale(1.5);
    z-index: -1;
}

/* adds inset shadow to element */
.drop {
    -webkit-box-shadow: inset 0px 10px 10px -5px rgba(0, 0, 0, 0.5);
        box-shadow: inset 0px 10px 10px -5px rgba(0, 0, 0, 0.5);
}

.blur {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
}

.fadeIn {
    opacity: 1 !important;
}


/* this creates bouncing effect in conjunction with class .bounce below */
@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
        transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
  }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
        transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
  }
}

.bounce {
    -webkit-animation: bounce 2s infinite;
        animation: bounce 2s infinite;
}