/* 
Theme Name: Twenty twenty Child 
Theme URL: http://yourdomain.com
Description: Twenty Twenty Child 
Theme Author: Your Name
Author URL: http://yourdomain.com
Template: twentytwenty 
Version: 1.0.0 
Text Domain: twentytwenty-child 
*/

@font-face {
    font-family: 'Aller';
    src: url('./fonts/Aller-Bold.eot');
    src: url('./fonts/Aller-Bold.eot?#iefix') format('embedded-opentype'),
        url('./fonts/Aller-Bold.woff2') format('woff2'),
        url('./fonts/Aller-Bold.woff') format('woff'),
        url('./fonts/Aller-Bold.ttf') format('truetype'),
        url('./fonts/Aller-Bold.svg#Aller-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aller Display';
    src: url('/fonts/AllerDisplay-Regular.eot');
    src: url('/fonts/AllerDisplay-Regular.eot?#iefix') format('embedded-opentype'),
        url('/fonts/AllerDisplay-Regular.woff2') format('woff2'),
        url('/fonts/AllerDisplay-Regular.woff') format('woff'),
        url('/fonts/AllerDisplay-Regular.ttf') format('truetype'),
        url('/fonts/AllerDisplay-Regular.svg#AllerDisplay-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aller';
    src: url('./fonts/Aller-Regular.eot');
    src: url('./fonts/Aller-Regular.eot?#iefix') format('embedded-opentype'),
        url('./fonts/Aller-Regular.woff2') format('woff2'),
        url('./fonts/Aller-Regular.woff') format('woff'),
        url('./fonts/Aller-Regular.ttf') format('truetype'),
        url('./fonts/Aller-Regular.svg#Aller-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aller';
    src: url('/fonts/Aller-Light.eot');
    src: url('/fonts/Aller-Light.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aller-Light.woff2') format('woff2'),
        url('/fonts/Aller-Light.woff') format('woff'),
        url('/fonts/Aller-Light.ttf') format('truetype'),
        url('/fonts/Aller-Light.svg#Aller-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
body:not(.home) .entry-content {
    padding-top:100px;
}
.entry-content > .contactform{
    margin-top:0 !important;
}
.zambezi_footer + #site-footer {
    margin-top:0;
}
.field-wrap>div  .ninja-forms-field[type="button"] {
    margin:80px auto;
    display:block;
    background-color:#A1D2E1
}
.field-wrap>div  .ninja-forms-field[type="button"]:hover {
    background-color: #216092;
    text-decoration:none;
    color:#fff;
}
.zambezi_footer {
    background-color:#181818;
    padding:8em 4em;
}
.footer_container {
    display:flex;
    max-width:1100px;
    margin: auto;
    flex-wrap: wrap;
}
.footer_container > div {
    flex: 1 1 43%;
}
.footer_container > div:first-child {
    margin-right:4%;
}
.footer_container .info_container {
    margin-left:8%;
}

.footer_container .info_container > div {
    display: flex;
    border-bottom:1px solid #fff;
    color:#fff;
    clear: both;
}
.footer_container .info_container > div:last-child {
    border-bottom:none;
}
.footer_container .info_container > div div {
    flex:1 1 50%;
    padding:10px;
    align-self:center;

}
.footer_container .info_container.info > div div:first-child {
    flex:0 1 30%;
}
.footer_container .info_container > div div p {
    margin:0;
}
body:not(.overlay-header) .primary-menu > li > a {
    text-decoration:none;
    transition:0.2s;
    letter-spacing:1px;
}
.primary-menu > li {
    overflow:hidden;
    height: 40px;
}
body:not(.overlay-header) .primary-menu > li > a:after, .zam_header_block h3:after {
    content: '';
    display:block;
    width:100%;
    height:5px;
    background-color:#a2cca2;
    position:absolute;
    top:420%;
    left:0;
    right:0;
    overflow-y:hidden;
    transition:0.4s;
    border-radius:3px;
    opacity:0.6;

}
.zam_header_block h3:after {
    top:450%;
    width:30%;
    margin:auto;
}
.zam_header_block {
    transition:0.2s;
}
.zam_header_block img {
    transition:0.2s;
 }
 .zam_header_block:hover {
     transition:0.2s;
 }
 .zam_header_block:hover {
     transition:0.2s;
     /* border-width:7px; */
     
     
 }
.zam_header_block:hover img {
    transition:0.2s;
    /* max-width:84px; */
}
.zam_header_block h3.zam-heading {
    transition: 0.2s;
    top:63%
}
.zam_header_block:hover h3 {
    transition: 0.2s;

}
body:not(.overlay-header) .primary-menu > li.current_page_item > a:after,.zam_header_block h3.zam-heading:after { 
top: 80%;
}


body:not(.overlay-header) .primary-menu > li:hover > a:after, .zam_header_block:hover h3:after {
    top:80%;
    transition:0.4s;
}
.zam_header_block:hover h3:after {
    top:120%
}
.footer_container .info_container > div div:last-child {
    border-left:1px solid #fff;
}
.footer_container > div svg {
    float:left;
    margin-right:20px;
    max-width:32px;
}

.footer_container > div h3 {
    margin:0;
    color:#fff;
    font-size:21px;
    text-transform:uppercase;
    margin: 3px auto 20px auto;
}
.footer_container > .footer_final {
    flex:0 0 100%;
    position: relative;
    z-index: 99;
    margin-top:8em;

}
.footer_container > .footer_final img {
    position:relative;
    top:-20px;
    z-index:-1;
}
.footer_container > .footer_final:after {
    /* content:''; */
    border-bottom:2px solid #878383;
    display: block;
    position:absolute;
    bottom: 5.2px;
    left: 0;
    right: 0;
    z-index:-1;
}
.banner {
    background-color:#c0bfbf;
    background-position:100% 31% !important;
}
.home #site-content .post-inner {
    margin-top:0;
    padding-top:0;
}
html body.template-full-width .entry-content > .banner {
    max-width:100% !important;
    width:100% !important;
}
.hero {
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    background-color:#c0bfbf;

}
.banner h2, .banner h3 {
    text-shadow: 2px 1px #000;
}
.hero > div {
    margin:auto
}
.service_column {
    background-color:#444;
    text-align:center;
    margin:0 20px;
}
.service_column img {
    max-width:180px;
    margin:auto;
}
.service_column:last-child {
    margin-right:0;
}
#search { position:relative}
#search button {
    background-color:transparent;
    position:absolute;
    color:#444;right:0;
}
#search button .dashicons {
    color: #898989;
}
.nin_left_half, .nin_left_half.nf-field-container{
    float:left;
    width:48%;
    margin-right:4%;
    clear:none;
}
nf-field:nth-child(2) .nin_left_half.nf-field-container {
    margin-right:0;
}
.nin_left_half.nf-field-container:nth-child(even) {
    margin-right:0;
}
.entry-content .info_container > div{
    display:flex;
    
}
.entry-content .info_container > div > div:first-child {
    flex-basis:25%;
}
.entry-content .info_container > div  {
    border-bottom:1px solid #ccc;

} 
.entry-content .info_container > div p {
    margin:0;
}
.entry-content .info_container > div > div {
padding:10px;
}
.entry-content .info_container > div div:nth-child(even) {
    border-left:1px solid #ccc;
}
body, 
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
span,div,ul,ol,li {
    font-family:'Aller', Arial, Helvetica, sans-serif;
}
.entry-content .banner h3{
    margin:0;

}
.nf-form-content label {
    text-transform:uppercase;
}
.nf-form-fields-required {
    text-align:center;
    font-size:80%;
    margin:20px auto;
}
.entry-content .banner h2 {
    margin-bottom:0;
}
.wp-block-columns.alignfull + .wp-block-columns.alignfull {
    margin-top:0
}

body:not(.overlay-header) .primary-menu > li > a,
body:not(.overlay-header) .primary-menu > li > .icon,
.modal-menu a, 
.footer-menu a, 
.footer-widgets a,
 #site-footer .wp-block-button.is-style-outline, .wp-block-pullquote::before, .singular:not(.overlay-header) .entry-header a, .archive-header a, .header-footer-group .color-accent, .header-footer-group .color-accent-hover:hover {
    color:#878383 !important;
}
body:not(.overlay-header) .primary-menu > li > a {
    text-transform:uppercase;
    letter-spacing:0.5px;
}
.header-inner,.footer_container,#site-footer .section-inner {
    max-width:90%;
}
#site-footer {
    padding:20px 0;
}
.service_column {
    border-radius:5px;
}
.entry-content .wp-block-columns.has-background.services  {
    padding:120px 0;
    margin-bottom:140px;
}
body .entry-content .ads figure.wp-block-image:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter) {
    margin-top:37px;
}
.services > .wp-block-column {
    max-width:1500px;
    margin:auto;
    max-height:320px;
    overflow-y:hidden;
}
.services img {
  
    padding:26px;
    transform:translateY(15px)
}
.services figure {
    position:relative;
    width: 160px;
    height:160;
    margin:20px auto;
}
.services .wp-block-image:after {
    content:'';
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    border-radius:50% !important;
    border:8px solid grey;
    display: block;
    padding: 80px;
    
}
.services h4 {
    text-transform: uppercase;
    font-size:24px;
   
}
.services h3 {
    text-align:center;
}
.abouttext {
    max-width:1182px;
    margin: auto;
}
.entry-content .about {
    margin:8em auto;
}
.entry-content .about h3 {
    margin-top:0;
}
.nomargin {
    margin: 0;
}
.entry-content .nf-form-content {
    max-width: unset;
}
.services section {
    margin:0 auto;
}
.entry-content > .alignwide:not(.wp-block-group.has-background), .entry-content > .alignfull:not(.wp-block-group.has-background),.alignnone, .aligncenter {
    margin-top:0;
}
.about {
    max-width:1300px;
    margin:auto;
    display:flex;
    margin-bottom:30px;
}
.about .pic, .about .content_container {
    flex: 1 1 50%;
    position:relative;
    
    /* gap: 1em; */
}
.about .pic {
    max-width:50%;
    margin:auto;
}

.about .pic img {
    width:100%;
}
.about .content_container > * {
    max-width:80%;
    margin:auto;
}
.about .content_container .icon {
    position:absolute;
    top:5%;
    right:5%;
    background-color:#fff;
    border:1px solid #fff;
    border-radius:50%;
    /* padding:20px; */
    width:13rem;
    height:13rem;
    text-align:center;
    line-height:8em;
}
.about .content_container .icon img {
line-height: 8em;
display: block;
margin:auto;
transform:translateY(24%);
max-width:90px;
}
.about .content_container {
    padding-right:13%;
    
}
.about .content_container * {
    color:#fff;
}
.about .content_container h3 {
    text-transform: lowercase;
    margin:100px auto;
    letter-spacing: 3px;
}
.about .about-link {
    position:absolute; 
    bottom:5%;
    right:5%;
    text-transform: uppercase;
    text-decoration:none;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

html, body {
    animation: fadein 0.2;
}
/* ========================================================== Home icon block */
.zam_header_block {
   /*  background-color:<?php block_field('background-color'); ?>; */
    position: relative;
    width: 150px;
    height: 150px;
    margin: 50px auto;
    margin-bottom:92px;
}
.zam_header_block a {
    border: 5px solid #ffffff;
    border-radius: 50%;
    width: 100%;
    height:100%;
    display: block;
}
.restaurant a{
    border-color:#f9a01d;  
}
.restaurant a:hover{
    border-color:#fff;
    color:#f9a01d;  
}
.zam_header_block.restaurant a:hover svg * {
    stroke:#f9a01d;
  
}

.shopping a{
    border-color:#f0483f;  
}
.shopping a:hover{
    border-color:#fff;
    color:#f0483f;  
}
.zam_header_block.shopping a:hover svg * {
    stroke:#f0483f;
  
}

.promotions a{
    border-color:#2eafc9;  
}
.promotions a:hover{
    border-color:#fff;
    color:#2eafc9;  
}
.zam_header_block.promotions a:hover svg * {
    stroke:#2eafc9;
  
}
.family a{
    border-color:#34afc8;  
}
.family a:hover{
    border-color:#fff;
    color:#34afc8;  
}
.zam_header_block.family a:hover svg * {
    stroke:#34afc8;
  
}
.health a{
    border-color:#84cba1;  
}
.health a:hover{
    border-color:#fff;
    color:#84cba1;  
}
.zam_header_block.health a:hover svg * {
    stroke:#84cba1;
  
}
.events a{
    border-color:#792c88;  
}
.events a:hover{
    border-color:#fff;
    color:#792c88;  
}
.zam_header_block.events a:hover svg * {
    stroke:#792c88;
  
}

.trading_hours a{
    border-color:#236193;  
}
.trading_hours a:hover{
    border-color:#fff;
    color:#236193;  
}
.zam_header_block.trading_hours a:hover svg * {
    stroke:#236193;
  
}

.zam_header_block a:hover {
    border-width:8px;
}
body:not(.overlay-header) .primary-menu > li > a {
    color:#25252c !important;
}
body:not(.overlay-header) .primary-menu > li.current_page_item > a {
    color:#a2cca2 !important;
}

.zam_header_block svg {
    /* flex: 1 1 ;
    flex-basis:32px; 
    max-width:30px;
    margin-right:30px;
    height:auto; 
    margin-left:15px; */
    padding:0;
    max-width:90px;
    position:absolute;
    left:0;
    right:0;
    transform:translate(0,28%);
    margin:auto;
}
.zam_header_block svg * {
    stroke:#fff;
}
.zam_title_block img {
    max-width:52px;
    float:left;
    margin:5px 20px;
}
.entry-content .zam_title_block h2 {
    font-size: 24px;
}
.widegap.wp-block-column:not(:first-child) {
    margin-left:4em;
}
.zam_title_block {
    height:62px;

}
.entry-content .zam_title_block > .zam_heading {
    margin:0;
    line-height:62px;
    text-transform:uppercase;
}
.zam_title_block + * {
    clear:both;
}
.entry-content .zam_header_block .zam_heading {
    margin:0;
    text-transform: uppercase;
    color: #fff;
    font-size: 21px;
    position: absolute;
    left: 0;
    right: 0;
    bottom:-40px;
    
}
/* ============================================ Footer */
a.socials  {
    background-color:#ccc;
    color:#fff;
    border-radius:50px;
    padding:0px;
    width:30px;
    height:30px;
    display:inline-block;
    margin-right:12px;
    text-align:center;
    line-height:25px;
    margin-top:-20px;
    border:3px solid transparent;
    float:right;
}
a.socials.facebook {
    background-color:#236193;
    border-color:#236193;
}
a.socials.heart {
    background-color:#F0483F;
    border-color:#F0483F;
}
a.social_link.globe {
    background-color:#84cba1;
    border-color:#84cba1;
}
a.socials.instagram {
    background-color:#F9A01D;
    border-color:#F9A01D;
}
a.socials:hover {
    background-color:transparent;
    border-color:#fff;
}
a.to-the-top {
    color:#a2cca2;
}
@media all and (max-width:1000px) {
    .footer_container {
        flex-wrap:wrap;
    }
    .footer_container > div {
        flex:1 1 100%;
        margin-bottom:20px;
        
    }
    .footer_container .info_container,.footer_container > div:first-child {
        margin-left:0;
        margin-right:0;
    }
    .footer_container > .footer_final img {
        top:0;
    }
    .services >  .wp-block-column {
        max-height:none;
        
    }
    .services  .wp-block-column .wp-block-column .wp-block-column{
        margin-bottom:4em;
    }
    .zam_header_block h3::after {
        opacity:0;
    }
    .uagb-block-dcab2cdc.uagb-columns__wrap.banner {
        background-position:41% 37% !important;
    }
    .about {
       flex-wrap:wrap;
    }
    .about .pic {
        max-width:100%;
    }
    .about .content_container {
        padding-left:13%;
    }
    .zambezi_footer {
        padding:8em 0;
    }
    .about .content_container h3 {
        margin:20px 0;
    }
    .about .pic.owl-carousel {
        order:1 
    }
    .about .content_container {
        order:2;
        min-height:400px;
    }
    .about {
        margin-bottom:0;
        display:flex;
        flex-wrap:wrap;
    }
    .about .pic, .about .content_container {
        flex:1 1 100%;
        padding-bottom:35px;
    }
    .about .content_container .icon {
        width:50px;
        height:50px;
        top:0;
    }
    .about .content_container .icon svg {
        max-width:35px;
        transform:translateY(6px);
    }
    .about .content_container > * {
        max-width: 100%;
    } 
    #search {
        display:block;

    }
    #search > *, #search label{
        width:100%;

    }
    #search label span {
        width:25%;
    }
    .category_container > div.headings {
        display:none;
    }
    .stores .content.active, .category_container > div {
        display:block;
        width:auto;
    }
    .headings > h3:nth-child(2), .content > div:nth-child(2),.headings h3, .content > div {
        border:none;
    }
    .content > div:last-child a {
        position:static;
    }
    .widegap.wp-block-column:not(:first-child) {
        margin-left:auto;
    }
    .calendar,.entry-content .calendar_titles {
        width:100%;
        margin-left:auto;
    }
    .entry-content .calendar_titles {
        margin:20px 0;
    }
    .store .container > div {
        width:90%;
        margin:auto;
    }
    .store .container {
        display:block;
    }
}