@font-face {
font-family: dashicons;
src: url(//www.africarunnerscompany.com/wp-includes/fonts/dashicons.woff),
url(//www.africarunnerscompany.com/wp-includes/fonts/dashicons.ttf) format("truetype"),
url(//www.africarunnerscompany.com/wp-includes/fonts/dashicons.svg#dashicons) format("svg"),
url(//www.africarunnerscompany.com/wp-includes/fonts/dashicons.eot);
font-weight: normal;
font-style: normal;
} #trp_ald_modal_container{
background-color: rgba(0,0,0,0.2);
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
position: fixed;
z-index: 2000000000000;
pointer-events: none;
}
#trp_ald_modal_popup{
box-shadow: 0 0 10px #6c7781;
top: 40px !important;
position: relative;
}
#trp_ald_modal_popup{
background-color: #F0F0EE;
width: 570px;
max-width: 75%;
border: 1px solid #4c6066;
padding: 25px 40px;
margin: auto;
pointer-events: auto;
} #trp_ald_popup_text{
text-align: left;
font-size: 17px;
} .trp_ald_select_and_button{
display: flex;
justify-content: space-between;
margin-top: 14px;
font-size: 17px;
}
.trp_ald_button{
margin-left: 12px;
width: 287px;
}
#trp_ald_popup_change_language{
text-transform: none;
width: 100%;
background: #2271b1;
border-color: #2271b1;
color: #fff;
text-decoration: none;
text-shadow: none;
justify-content: center;
align-items: center;
display: inline-grid;
font-weight: normal;
font-size: 17px;
height: 50px;
min-height: 30px;
margin: 0;
padding: 0;
cursor: pointer;
border-width: 1px;
border-style: solid;
-webkit-appearance: none;
border-radius: 3px;
white-space: nowrap;
box-sizing: border-box;
}
#trp_ald_popup_change_language:hover {
background: #135e96;
border-color: #135e96;
color: #fff;
} #trp_ald_x_button_and_textarea{
text-decoration: none;
display: flex;
vertical-align: middle;
align-items: center;
cursor: pointer !important;
color: #0085ba !important;
font-size: 14px;
margin-top: 15px;
width:50%;
height: 100%;
pointer-events: visibleFill;
}
#trp_ald_x_button_textarea{
text-decoration: underline;
margin-bottom: 3px;
height: auto;
width:auto;
color: #0085ba !important;
cursor: pointer !important;
text-align: left;
}
#trp_ald_x_button_textarea:hover{
background-color: transparent;
pointer-events: auto;
cursor: pointer !important;
z-index: 20000000000000;
}
#trp_ald_modal_popup #trp_ald_x_button{
display: inline-table;
width: 0;
background: 0 0;
padding: 0;
border: none;
text-decoration: none;
color: transparent;
-webkit-backface-visibility: hidden;
outline:none;
z-index: 1;
}
#trp_ald_modal_popup #trp_ald_x_button::before {
content: "\f153";
font: normal 16px/20px dashicons;
text-align: center;
color: #0085ba !important;
background: 0 0 !important;
-webkit-font-smoothing: antialiased;
}
#trp_ald_modal_popup #trp_ald_x_button::before:hover{
background: 0 0;
} .trp_ald_ls_container{
height: 50px;
width: 100%;
color: #4c6066;
font-size: 19px;
}
.trp_ald_ls_container .trp-language-switcher-container{
width: 100%;
margin: 0;
user-select: none;
}
.trp_ald_ls_container .trp-language-switcher-container > div{
background-image: linear-gradient(
60deg
, transparent 50%, #C9C0BB 50%), linear-gradient(
120deg
, #C9C0BB 50%, transparent 50%);
background-position: calc(100% - 18px) calc(1em), calc(100% - 12px) calc(1em);
background-size: 6px 12px, 6px 12px;
background-repeat: no-repeat;
}
.trp_ald_ls_container .trp-language-switcher-container .trp-ls-shortcode-language.trp-ls-clicked{
background-image: none;
}
.trp_ald_ls_container .trp-ls-shortcode-current-language{
width: 100%;
height: 50px;
justify-content: left;
padding-bottom: 12px;
border: 2px solid #C9C0BB;
padding-top: 8px;
padding-right: 33px;
vertical-align: middle;
color: #4c6066;
font-size: 18px;
overflow: hidden;
}
.trp_ald_ls_container .trp-ls-shortcode-language{
width: 100%;
height: 50px;
justify-content: left;
border: 2px solid #C9C0BB;
z-index: 1000000000000000;
}
.trp_ald_ls_container .trp-ls-shortcode-current-language:hover{
cursor: pointer;
}
.trp_ald_ls_container .trp-ls-shortcode-language > div:hover{
cursor: pointer;
background: #135e96;
color: #ffffff;
}
.trp_ald_ls_container .trp-ald-popup-select{
padding-top: 5px;
padding-bottom: 5px;
padding-right: 33px;
font-size: 18px;
margin-right: -15px;
}
.trp_ald_ls_container .trp-ls-shortcode-current-language{
padding-bottom: 12px;
padding-top: 6px;
vertical-align: middle;
color: #4c6066;
font-size: 18px;
}
.trp_ald_ls_container .trp-ls-shortcode-language{
padding-bottom: 3px;
padding-top: 3px;
vertical-align: middle;
color: #4c6066;
font-size: 18px;
}
.trp_ald_ls_container .trp-ls-shortcode-current-language img.trp-flag-image{
display: inline-block;
padding-top: 9px;
margin-left: 8px;
margin-right: 8px;
pointer-events: none;
}
.trp_ald_ls_container .trp-ls-shortcode-language img.trp-flag-image{
display: inline-block;
padding-top: 9px;
margin-left: 8px;
margin-right: 8px;
pointer-events: none;
}
.trp_ald_ls_container #trp_ald_popup_current_language{
padding-top: 8px;
padding-right: 33px;
vertical-align: middle;
color: #4c6066;
font-size: 18px;
overflow: hidden;
}
#trp_ald_popup_select_container .trp-ls-shortcode-language{
display: none;
} .trp_ald_ls_container .trp-language-switcher .trp-ls-shortcode-current-language.trp-ls-clicked{
visibility: hidden;
}
.trp_ald_ls_container .trp-language-switcher:hover div.trp-ls-shortcode-current-language{
visibility: visible;
}
.trp_ald_ls_container .trp-language-switcher:hover div.trp-ls-shortcode-language{
visibility: hidden;
height: 1px;
}
.trp_ald_ls_container .trp-language-switcher .trp-ls-shortcode-language.trp-ls-clicked,
.trp_ald_ls_container .trp-language-switcher:hover .trp-ls-shortcode-language.trp-ls-clicked{
visibility:visible;
height:auto;
position: absolute;
left: 0;
top: 0;
display: inline-block !important;
} #trp_no_text_popup_wrap{
width: 100%;
background-color: #F0F0EE;
z-index: 999999999999999999999999999999999;
box-shadow: 0 0 10px #6c7781;
}
#trp_no_text_popup{
align-items: center;
padding: 25px 30px;
border: 1px solid grey;
justify-content: space-between;
display: flex;
vertical-align: middle;
}
#trp_ald_not_text_popup_ls_and_button{
display: flex;
justify-content: center;
width: 100%;
vertical-align: middle;
align-items: center;
} #trp_ald_no_text_popup_div {
text-align: left;
font-size: 17px;
margin-right: 10px;
max-width: 375px;
} #trp_ald_not_text_popup_buttons_wrap{
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
#trp_ald_not_text_popup_ls_and_button .trp_ald_ls_container{
max-width: 240px;
color: #4c6066;
font-size: 19px;
}
#trp_ald_not_text_popup_ls_and_button .trp_ald_ls_container #trp_ald_popup_current_language{
padding-top: 8px;
padding-right: 33px;
vertical-align: middle;
color: #4c6066;
font-size: 18px;
overflow: hidden;
}
#trp_ald_not_text_popup_ls_and_button .trp_ald_ls_container .trp-ls-shortcode-language{
padding-bottom: 3px;
padding-top: 3px;
vertical-align: middle;
} .trp_ald_change_language_div{
min-width: 173px;
height: auto;
}
#trp_ald_no_text_popup_change_language{
text-transform: none;
padding: 4px 10px;
height: 50px;
text-align: center;
background: #2271b1;
border-color: #2271b1;
color: #fff;
text-decoration: none;
text-shadow: none;
display: inline-block;
font-weight: normal;
font-size: 17px;
line-height: 2.15384615;
min-height: 30px;
margin-left: 10px;
width: 100%;
cursor: pointer;
border-width: 1px;
border-style: solid;
-webkit-appearance: none;
border-radius: 3px;
white-space: nowrap;
box-sizing: border-box;
}
#trp_ald_no_text_popup_change_language:hover {
background: #135e96;
border-color: #135e96;
color: #fff;
} #trp_ald_no_text_popup_x{
width: 65px;
padding-left: 5px;
}
#trp_no_text_popup #trp_close{
width: 0;
background: 0 0;
padding: 0;
border: none;
text-decoration: none;
color: transparent;
-webkit-backface-visibility: hidden;
outline:none;
}
#trp_no_text_popup #trp_close::before {
content: "\f153";
font: normal 35px/40px dashicons;
text-align: center;
cursor: pointer;
color: #0085ba !important;
background: 0 0 !important;
-webkit-font-smoothing: antialiased;
}
#trp_ald_no_text_popup_x_button_and_textarea{
display:none;
cursor: pointer;
vertical-align: middle;
}
#trp_ald_no_text_popup_x_button_textarea{
text-decoration: underline;
margin-bottom: 3px;
color: #0085ba;
font-size: 15px;
margin-top: 15px;
}
#trp_ald_no_text_popup_x_button{
width: 0;
background: 0 0;
padding: 0;
border: none;
text-decoration: none;
color: transparent;
-webkit-backface-visibility: hidden;
outline:none;
}
#trp_ald_no_text_popup_x_button::before{
content: "\f153";
font: normal 16px/20px dashicons;
text-align: center;
color: #0085ba !important;
background: 0 0 !important;
-webkit-font-smoothing: antialiased;
} @media screen and (max-width: 937px){ #trp_ald_not_text_popup_ls_and_button{
width: 80%;
}
}
@media screen and (max-width: 780px) {
#trp_ald_modal_popup {
width: 80%;
}
.trp_ald_select_and_button{
display: block;
margin-top: 32px;
}
.trp_ald_ls_container #trp_ald_popup_current_language{
overflow: hidden;
}
.trp_ald_button{
width: 100%;
margin-left: 0;
margin-top: 14px;
}
#trp_ald_x_button_and_textarea{
width: 100%;
} #trp_no_text_popup{
justify-content: center;
}
#trp_ald_not_text_popup_ls_and_button{
display: block;
max-width: 240px;
}
#trp_ald_no_text_popup_x{
display:none;
}
#trp_ald_no_text_popup_x_button_and_textarea{
display: block;
}
#trp_ald_not_text_popup_ls_and_button .trp_ald_ls_container{
max-width: 100%;
margin-top: 32px;
}
#trp_ald_no_text_popup_select_container{
display: none;
}
.trp_ald_change_language_div{
width: 100%;
margin-top: 14px;
min-width: 30px;
}
#trp_ald_no_text_popup_change_language{
margin-left: 0;
height: unset;
white-space: pre-wrap;
}
#trp_ald_no_text_popup_x_button_and_textarea{
margin-top: 15px;
}
}:root {
--black-color: #395144; --darkest-color: #395144;
--darkest-color-two: #2c3639; --darker-color: #4e6c50;
--light-green: #f0ebce;
--lightest-green: #f0ebce;
--light-body-color: #f0ebce;
--light-body-color-alt: #d9d3ae;
--cta-color-one: #aa8b56;
--cta-color-two: #aa8b56;
--cta-color-three: #c55300;
--heading-font: 'Vollkorn', serif;
--main-font: 'Montserrat', sans-serif;
} html {
scroll-behavior: smooth;
}
body {
font-family: var(--main-font);
font-size: 16px;
font-size: 1rem;
line-height: 25px;
line-height: 1.563;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--heading-font);
}
input[type='text'],
input[type='email'],
input[type='url'],
input[type='password'],
textarea,
select {
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
height: 3.1375rem;
margin: 5px 0 1.5rem;
padding: 0.5rem;
border: 2px solid #aaa;
border-radius: 5px;
background-color: #fff;
font-family: inherit;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
-webkit-transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
transition: box-shadow 0.5s, border-color 0.25s ease-in-out,
-webkit-box-shadow 0.5s;
}
.wpcf7-submit,
#pespal_pay_btn {
background: var(--cta-color-three);
border-color: var(--cta-color-three);
padding: 10px 50px;
font-size: 1rem;
color: #ffffff;
border-radius: 0px;
border: 0px;
margin-top: 0px;
text-transform: uppercase;
}
textarea {
height: 150px;
}
.wpcf7-form {
font-size: 0.9rem;
padding: 20px 0px;
}  .banner {
background-repeat: no-repeat !important;
background-position: center center !important;
background-size: cover !important;
height: 700px;
}
.home-banner {
background: url(https://www.africarunnerscompany.com/wp-content/uploads/2023/04/slide-1.jpg);
}
.page-update {
height: 600px !important;
}
.category-update {
height: 400px !important;
}
.downer-header-section {
transform: rotate(3deg);
top: -50px;
right: -26px;
}
.downer-header-section-two {
transform: rotate(5deg);
top: -30px;
right: -26px;
}
.downer-header-section-three {
transform: rotate(7deg);
top: -10px;
right: -26px;
}
.banner-text h2 {
font-size: 53px;
font-size: 3.313rem;
line-height: 68px;
line-height: 4.25rem;
}
.banner-text p {
font-size: 20px;
font-size: 1.25rem;
line-height: 30px;
line-height: 1.875rem;
}
.header-top ul {
margin-bottom: 0px;
padding-bottom: 0px;
margin-left: 0px;
padding-left: 0px;
}
.header-top input[type='search'] {
width: 400px !important ;
}  .main-navigation {
clear: both;
display: block;
float: left;
width: 100%;
}
.main-navigation ul {
list-style: none;
margin: 0;
padding-left: 0;
}
.main-navigation li {
float: left;
position: relative;
}
.main-navigation a {
display: block;
text-decoration: none;
}
.main-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
float: left;
position: absolute;
top: 1.5em;
left: -999em;
z-index: 99999;
}
.main-navigation ul ul ul {
left: -999em;
top: 0;
}
.main-navigation ul ul a {
width: 300px;
color: #fff !important;
font-size: 14px !important;
letter-spacing: normal !important;
}
.main-navigation ul ul li {
}
.main-navigation li:hover > a,
.main-navigation li.focus > a {
}
.main-navigation ul ul :hover > a,
.main-navigation ul ul .focus > a {
}
.main-navigation ul ul a:hover,
.main-navigation ul ul a.focus {
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul,
.main-navigation ul li:focus-within > ul {
left: auto;
}
.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul,
.main-navigation ul ul li:focus-within > ul {
left: 100%;
}
.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a {
} .menu-toggle,
.main-navigation.toggled ul {
display: block;
}
@media screen and (min-width: 37.5em) {
.menu-toggle {
display: none;
}
.main-navigation ul {
display: block;
}
}
.main-navigation ul li a {
text-transform: capitalize;
padding-left: 24px;
padding-right: 24px;
color: #fff;
font-size: 16px;
line-height: 24px;
letter-spacing: 0.1em;
}
.main-navigation ul li a:active,
.main-navigation ul li a.current {
color: var(--light-body-color) !important;
}
.main-navigation ul ul {
background: var(--darkest-color-two);
top: 100%;
border-top: 2px solid var(--cta-color-three) !important;
}
.main-navigation ul ul li { }
.main-navigation .menu {
margin-bottom: 0;
}
.main-navigation ul ul li a {
padding: 9px 20px;
border: 0;
}
.main-navigation ul ul li a:hover {
background-color: var(--cta-color-three);
}
.main-navigation ul li svg {
font-size: 12px;
line-height: 16px;
color: #2c3e50;
display: inline-block;
position: absolute;
top: 70%;
left: 47%;
}
.main-navigation ul ul li:last-child {
border: 0;
}
.main-navigation ul li a:hover,
.main-navigation ul .current-menu-item,
.main-navigation ul li:hover > a {
background: none;
}
.main-navigation ul:after {
content: '';
display: block;
clear: both;
}
.main-navigation ul .menu-item-has-children:after {
position: absolute;
right: 0;
top: 45%;
content: '';
width: 15px;
height: 15px;
background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 256 512'%3E%3Cpath d='M119.5 326.9L3.5 209.1c-4.7-4.7-4.7-12.3 0-17l7.1-7.1c4.7-4.7 12.3-4.7 17 0L128 287.3l100.4-102.2c4.7-4.7 12.3-4.7 17 0l7.1 7.1c4.7 4.7 4.7 12.3 0 17L136.5 327c-4.7 4.6-12.3 4.6-17-.1z'/%3E%3C/svg%3E")
center center no-repeat;
}
.main-navigation ul ul .menu-item-has-children:after {
left: 90%;
top: 50%;
background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 192 512'%3E%3Cpath d='M166.9 264.5l-117.8 116c-4.7 4.7-12.3 4.7-17 0l-7.1-7.1c-4.7-4.7-4.7-12.3 0-17L127.3 256 25.1 155.6c-4.7-4.7-4.7-12.3 0-17l7.1-7.1c4.7-4.7 12.3-4.7 17 0l117.8 116c4.6 4.7 4.6 12.3-.1 17z'/%3E%3C/svg%3E")
center center no-repeat;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
transform: translateY(-50%);
}  .cta-section .upper-cta {
background: url(https://www.africarunnerscompany.com/wp-content/uploads/2023/02/cta-down-two.jpg);
background-size: cover;
background-position: center center;
height: 550px;
}
.cta-section .cta-image-down img {
border: 10px solid #ffffff;
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
border-radius: 0px 0px 30px 30px;
transform: rotate(-5.93deg);
}
.entry-content p {
line-height: 1.8rem !important;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5 {
margin-top: 40px;
margin-bottom: 40px;
font-weight: 700;
}
.first-about-section .entry-content h1,
.first-about-section .entry-content h2,
.first-about-section .entry-content h3,
.first-about-section .entry-content h4,
.first-about-section .entry-content h5 {
font-family: var(--main-font);
font-weight: 700;
}
.intro-about p {
font-size: 1.2rem !important;
line-height: 1.963 !important;
}
.second-about-section ol li {
padding: 10px 0px;
}
#CDSWIDSSP {
width: 100% !important;
}
a.safari-wrap-link {
text-decoration: none !important;
color: var(--darkest-color-two);
}
a.safari-wrap-link .safari-wrap {
width: 100%;
height: 300px;
background-position: center center !important;
background-size: cover !important;
}
a.safari-wrap-link .safari-wrap h4 {
text-decoration: none !important;
color: var(--darkest-color-two);
}
.nav-links a.page-numbers,
.nav-links span.current {
background: var(--black-color);
padding: 10px 20px;
border-radius: 5px;
color: #fff;
text-decoration: none;
border: 2px solid var(--black-color);
font-weight: 700;
font-size: 20px;
margin-right: 5px;
}
.nav-links span.current,
.nav-links a:hover {
background: var(--cta-color-one);
border: 2px solid var(--cta-color-one);
color: var(--darkest-color-two);
}
.top-160 {
top: 160px;
}
#btn-back-to-top {
position: fixed;
bottom: 30px;
right: 10px;
display: none;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
background-color: var(--cta-color-three) !important;
}  .footer-top h3.widget-title {
font-weight: 700;
font-size: 17px;
line-height: 26px;
color: var(--light-body-color);
font-family: var(--main-font) !important;
}
.footer-top ul {
margin-left: 0px;
padding-left: 0px;
margin-top: 30px;
list-style-type: none;
}
.footer-top ul li a {
font-size: 14px;
line-height: 33px;
color: var(--light-body-color);
text-decoration: none;
}
.footer-top ul li a:hover {
text-decoration: underline;
color: var(--light-body-color);
}    .letter-spacing-one {
letter-spacing: 1px;
}
.font-main {
font-family: var(--main-font) !important;
}
.font-heading {
font-family: var(--heading-font) !important;
}
.main-overlay {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: linear-gradient(
76.54deg,
rgba(0, 0, 0, 0.96) 0%,
rgba(0, 0, 0, 0) 94.51%
);
}
.overlay-2 {
background: linear-gradient(
180deg,
#f0ebce 15.62%,
rgba(240, 235, 206, 0) 100%
);
position: absolute;
width: 100%;
height: 200px;
top: 0;
left: 0;
}
.bg-black-color {
background-color: var(--black-color);
}
.bg-darkest-two {
background-color: var(--darkest-color-two);
}
.bg-darkest {
background-color: var(--darkest-color);
}
.bg-darker {
background-color: var(--darker-color);
}
.bg-light-green {
background-color: var(--light-green);
}
.bg-lightest-green {
background-color: var(--lightest-green);
}
.bg-light-body {
background-color: var(--light-body-color);
}
.bg-light-body-alt {
background-color: var(--light-body-color-alt);
}
.bg-light-body-alt-two {
background: var(--light-body-color-alt) url(//www.africarunnerscompany.com/wp-content/themes/arc/images/brushed-alum-dark.png);
}
.bg-cta-one {
background-color: var(--cta-color-one);
}
.bg-cta-two {
background-color: var(--cta-color-two);
}
.bg-cta-three {
background-color: var(--cta-color-three);
}
.border-darkest {
border-color: var(--darkest-color) !important;
}
.border-darker {
border-color: var(--darker-color) !important;
}
.border-light-green {
border-color: var(--light-green) !important;
}
.border-lightest-green {
border-color: var(--lightest-green) !important;
}
.border-light-body {
border-color: var(--light-body-color) !important;
}
.border-cta-one {
border-color: var(--cta-color-one) !important;
}
.border-cta-two {
border-color: var(--cta-color-two) !important;
}
.color-darkest {
color: var(--darkest-color) !important;
}
.color-darker {
color: var(--darker-color) !important;
}
.color-light-green {
color: var(--light-green) !important;
}
.color-lightest-green {
color: var(--lightest-green) !important;
}
.color-light-body {
color: var(--light-body-color) !important;
}
.color-cta-one {
color: var(--cta-color-one) !important;
}
.color-cta-two {
color: var(--cta-color-two) !important;
}
.index-one {
z-index: 1;
}
.index-one {
z-index: 1;
}
.index-two {
z-index: 2;
}
.index-three {
z-index: 3;
}
.index-four {
z-index: 4;
}
.index-five {
z-index: 5;
}
.shadow-text {
text-shadow: 0px 2px 2px #000000;
}
.shadow-div {
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
.radius-one {
border-radius: 66px;
}
.social-icon span {
background-color: var(--light-green) !important;
color: var(--darkest-color) !important;
}
.btn-outline-warning:hover {
background-color: var(--cta-color-three) !important;
background: var(--cta-color-three) !important;
color: #fff !important; }
.up-push {
margin-top: -150px;
} #mobile-menu-opener {
display: none;
}
@media (max-width: 1199.98px) {
.main-navigation {
position: fixed;
top: 0;
right: 0;
width: 320px;
height: 100%;
z-index: 10;
background: var(--darkest-color-two);
padding-top: 80px;
-webkit-transform: translateX(420px);
-moz-transform: translateX(420px);
transform: translateX(420px);
-webkit-transition: ease 0.35s;
-moz-transition: ease 0.35s;
transition: ease 0.35s;
}
body.menu-open .main-navigation {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
transform: translateX(0);
}
.main-navigation li {
float: none;
display: block;
width: 100%;
}
.main-navigation li .angle-down {
position: absolute;
top: 0;
right: 0;
background: transparent;
cursor: pointer;
width: 58px;
height: 58px;
-webkit-transition: ease 0.2s;
-moz-transition: ease 0.2s;
transition: ease 0.2s;
}
.main-navigation li .angle-down.active {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
transform: rotate(180deg);
}
.main-navigation li .angle-down:after {
position: absolute;
top: 50%;
left: 50%;
width: 15px;
height: 20px;
content: '';
background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 256 512'%3E%3Cpath d='M119.5 326.9L3.5 209.1c-4.7-4.7-4.7-12.3 0-17l7.1-7.1c4.7-4.7 12.3-4.7 17 0L128 287.3l100.4-102.2c4.7-4.7 12.3-4.7 17 0l7.1 7.1c4.7 4.7 4.7 12.3 0 17L136.5 327c-4.7 4.6-12.3 4.6-17-.1z'/%3E%3C/svg%3E")
center center no-repeat;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
filter: brightness(0) invert(1);
}
.main-navigation ul li a {
padding: 15px 20px;
display: block;
border-right: 0; }
.main-navigation ul .menu-item-has-children:after {
display: none;
}
.main-navigation ul ul {
border-top: 1px solid #ebedef;
box-shadow: none;
float: none;
position: unset;
left: inherit;
background: var(--bg-darkest-green);
display: none;
}
.main-navigation ul ul li a {
width: 100%;
padding: 20px;
}
#mobile-menu-opener {
display: block;
width: 50px;
height: 35px;
cursor: pointer;
padding: 10px;
}
#mobile-menu-opener span {
display: block;
width: 100%;
height: 2px;
background: #000;
margin-bottom: 5px;
}
#mobile-menu-opener span:last-child {
margin-bottom: 0;
}
.main-navigation .btn-close-menu {
width: 50px;
height: 50px;
border: 2px solid #fff;
border-radius: 50%;
position: absolute;
top: 15px;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
transform: translateX(-50%);
cursor: pointer;
}
.main-navigation .btn-close-menu:after {
position: absolute;
top: 50%;
left: 50%;
width: 20px;
height: 25px;
content: '';
background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 320 512'%3E%3Cpath d='M193.94 256L296.5 153.44l21.15-21.15c3.12-3.12 3.12-8.19 0-11.31l-22.63-22.63c-3.12-3.12-8.19-3.12-11.31 0L160 222.06 36.29 98.34c-3.12-3.12-8.19-3.12-11.31 0L2.34 120.97c-3.12 3.12-3.12 8.19 0 11.31L126.06 256 2.34 379.71c-3.12 3.12-3.12 8.19 0 11.31l22.63 22.63c3.12 3.12 8.19 3.12 11.31 0L160 289.94 262.56 392.5l21.15 21.15c3.12 3.12 8.19 3.12 11.31 0l22.63-22.63c3.12-3.12 3.12-8.19 0-11.31L193.94 256z'/%3E%3C/svg%3E")
center center no-repeat;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
filter: brightness(0) invert(1);
}
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.85);
z-index: 2;
-webkit-transition: ease 0.35s;
-moz-transition: ease 0.35s;
transition: ease 0.35s;
opacity: 0;
visibility: hidden;
}
body.menu-open .overlay {
visibility: visible;
opacity: 1;
}
.site-branding img {
width: 250px !important;
}
.main-navigation ul li a {
padding-left: 14px;
padding-right: 14px;
letter-spacing: 0em;
}
}
@media (max-width: 767.98px) {
.banner-text h2 {
font-size: 2.313rem;
line-height: 38px;
}
.banner {
height: 500px;
}
.page-update {
height: 400px !important;
}
.up-push {
margin-top: 0px;
}
}
@media (max-width: 575.98px) {
}