.elementor-kit-43277{--e-global-color-primary:#DD8C28;--e-global-color-secondary:#54595F;--e-global-color-text:#000000;--e-global-color-accent:#61CE70;--e-global-color-228533e:#F48E1E;--e-global-color-98e223f:#4E58CC;--e-global-color-0bcefbd:#252835;--e-global-color-189c728:#808080;--e-global-color-a85b3cb:#000000;--e-global-color-83cd311:#FFFFFF;--e-global-color-3301795:#16925D;--e-global-color-aa03529:#25548E;--e-global-color-17bee19:#DD8C28;--e-global-color-efc255e:#16925D;--e-global-color-35aacb1:#25548E;--e-global-color-3b66a91:#1E1E1E;--e-global-color-f3c6733:#1E1E1E;--e-global-color-9055a6a:#C6C6C6;--e-global-color-d4cf9bb:#0D98CB;--e-global-color-ed97386:#28DD38;--e-global-color-8c3404e:#EEF6FF;--e-global-color-c1e59ef:#F56950;--e-global-color-ea92a55:#FFE5E0;--e-global-color-ec36efb:#EFA30E;--e-global-color-9dc413b:#FFF2D9;--e-global-color-ff877e1:#8A8282;--e-global-color-4bf9c8e:#664D4D;--e-global-color-0565519:#512C75;--e-global-color-5a4975f:#280848;--e-global-color-63560d8:#1F033C;--e-global-color-82c3dc9:#130224;--e-global-color-174b330:#8B5CB8;--e-global-color-a0c7006:#CEC0F7;--e-global-color-a030af2:#4495F8;--e-global-color-2a2b7b4:#44F8A8;--e-global-color-76c702c:#F8ED44;--e-global-color-d4b44d5:#9744F8;--e-global-color-96bbb42:#2FDEEE;--e-global-color-0d355fc:#8BF998;--e-global-color-88857f6:#F4EC7B;--e-global-color-3e12324:#ECFEEE;--e-global-color-12abeff:#FFD43B;--e-global-color-d86f01c:#646464;--e-global-color-10ec620:#306998;--e-global-color-87c116b:#4B8BBE;--e-global-color-3d8ce36:#A64894;--e-global-color-9694bec:#39F4E3;--e-global-color-a0b405d:#EFA30E;--e-global-color-9f9ec2b:#E5FBFB;--e-global-color-0674efb:#44F8A8;--e-global-color-3cdba7c:#002D62;--e-global-color-d63f9e2:#002D62;--e-global-color-dd0d311:#9C9C9C;--e-global-color-229253b:#FEFDEF;--e-global-color-ba287a4:#FFE8BE;--e-global-color-92a9a5f:#E3EAFF;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Montserrat Alternates";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Montserrat";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Montserrat";--e-global-typography-accent-font-weight:500;--e-global-typography-35404da-font-family:"Montserrat";--e-global-typography-35404da-font-size:32px;--e-global-typography-35404da-font-weight:700;}.elementor-kit-43277 e-page-transition{background-color:var( --e-global-color-text );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1100px;}.e-con{--container-max-width:1100px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:760px;}.e-con{--container-max-width:760px;}}/* Start custom CSS */.primary {
    color: var(--e-global-color-primary);
}

/* HORIZONTALL SCROLLING CSS*/

/*INSTRUCTIONS FOR HORIZONTAL SCROLL ON POSTS BY THEAFRICANBOSS.COM
1. add the CSS class 'horizontally' to the posts element you want the effect applied to
2. if u want same post height, add CSS class'scrollingCol' to the column (not section) containing the posts
3. Add the CSS code below EITHER
- your CHILD THEME style.css file
- or add it to an HTML element you can place anywhere in your page with open style tag and closing style tag surrounding the code below
- or add it to the page custom CSS under Advanced tab in Page Settings where the posts are
*/


/* for post WIDTH on MOBILE, adjust the pixels below */

@media screen and (max-width: 726px) {
    .horizontally>div>div>article {
        max-width: 300px;
         /*width on desktop */
    }
}

/* for post WIDTH on DESKTOP, adjust the pixels below */
@media screen and (max-width: 1026px) {
    .horizontally>div>div>article {
        width: 400px;
         /*width on desktop */
    }
}


/* for SAME post HEIGHT on DESKTOP, adjust the pixels below */
@media screen and (max-width: 580px) {
   .scrollingCol .elementor-container {
         min-height: 455px;
    /* height on mobile */
    }
}

/* for your own custom swiping cursor, add a 36x36 png URL of your choosing in this format "cursor: url(https://theafricanboss.com/wp-content/uploads/2020/07/swipe-left-right-lg.png), ew-resize;" */
@media only screen and (max-width: 1026px) {
.horizontally ::after,
.horizontally ::before{
    content: '';
    width: 10px;
}
.horizontally>div {
    margin-left: -26px;
    margin-right: -16px;
    cursor: ew-resize;
    display: flex;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

.horizontally>div::-webkit-scrollbar {
    /*height: 4px;*/
}

.horizontally>div::-webkit-scrollbar-track {
    background: black;
    background: rgba(0, 0, 0, 0.1);
}

.horizontally>div::-webkit-scrollbar-thumb {
    background: black;
    background: rgba(0, 0, 0, 0.31);
}

.horizontally>div>div {
    display: flex !important;
    flex-wrap: nowrap;
    flex: 0 0 auto;
}
}

/*////////////////////////////////////////////////*/
.numericTitle > *:not(before) {
    z-index: 2;
    position: relative;
}

.numericTitle:before {
        content: attr(data-number);
    /* background: black; */
    display: block;
    position: absolute;
    color: var(--e-global-color-primary);
    font-weight: 900;
    font-size: 50px;
    line-height: 61px;
    opacity: .3;
    top: -24px;
    left: -19px;
    z-index: 0;
}/* End custom CSS */