/*
Theme Name: Divi-5
Theme URI: http://www.elegantthemes.com/gallery/divi/
Template: Divi
Author: Avily
Author URI: https://www.avily.co.za
Description: Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection.
Version: 1.0.1768983495
Updated: 2026-01-21 10:18:15

*/


h1, h2, h3, h4, h5, h6{
	font-family: contralto-small, sans-serif !important;
}
body, p, span{
	font-family: sofia-pro-variable, sans-serif !important;
}


	
/*
	-------------------------------------------------------------------------------------
	-------------------------------- Mobile Menu Styling --------------------------------
	-------------------------------------------------------------------------------------
*/

/*change hamburger icon to x when mobile menu is open*/

#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before,
.et_pb_module.et_pb_menu .et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before {
	content: '\4d';
}


/*adjust the new toggle element which is added via jQuery*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle {
	width: 44px;
	height: 100%;
	padding: 0px !important;
	max-height: 44px;
	border: none;
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 999;
	background-color: transparent;
}


/*some code to keep everyting positioned properly*/

ul.et_mobile_menu>li.menu-item-has-children,
ul.et_mobile_menu>li.page_item_has_children,
ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children {
	position: relative;
}


/*remove default background color from menu items that have children*/

.et_mobile_menu .menu-item-has-children>a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children>a {
	background-color: transparent;
}
 
/*hide the submenu by default*/

ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
	display: none !important;
	visibility: hidden !important;
}


/*show the submenu when toggled open*/

ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
	display: block !important;
	visibility: visible !important;
}


/*adjust the toggle icon position and transparency*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle {
	text-align: center;
	opacity: 1;
}


/*submenu toggle icon when closed*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after {
	top: 10px;
	position: relative;
	font-family: "ETModules";
	content: '\33';
	color: #1d7b89;
	background: #f0f3f6;
	border-radius: 50%;
	padding: 3px;
}


/*submenu toggle icon when open*/

ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after {
	content: '\32';
}


/*add point on top of the menu submenu dropdown*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu:after {
	position: absolute;
	right: 5%;
	margin-left: -20px;
	top: -14px;
	width: 0;
	height: 0;
	content: '';
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #ffffff;
}


/*adjust the position of the hamburger menu*/

.mobile_menu_bar {
	position: relative;
	display: block;
	bottom: 10px;
	line-height: 0;
}


/*force the background color and add a rounded border*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu,
.et_pb_menu_0.et_pb_menu .et_mobile_menu ul {
	background-color: #ffffff!important;
	border-radius: 10px;
}

.et_mobile_menu .menu-item-has-children .sub-menu{
display: none !important;
}

.pa-block{
display: block !important;
height: fit-content !important;
padding-top: 0 !important;
margin-top: 0 !important;
padding: 5% !important;
margin-bottom: 0 !important;
margin-top: 0 !important;
}

.et_mobile_menu .menu-item-has-children .pa-submenu{
display: block !important;
}

.opened .et_mobile_menu{
height: fit-content !important;
padding: 5% !important;
}


ul.et_mobile_menu li.menu-item-has-children .mobile-toggle, .et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle{
    	    text-align: right;
    	    width: 100%;
    }


/*
	-------------------------------------------------------------------------------------
	---------------------------- Header burger + About mobile order ---------------------
	-------------------------------------------------------------------------------------
*/

/* Burger icon: white at every width (tablet was inheriting the blue primary colour) */
.et_pb_menu_0_tb_header .mobile_nav .mobile_menu_bar:before {
	color: #ffffff !important;
}

/* Tablet + mobile: the icon sat ~8px above the centre of the blue bar; nudge it down to centre it */
@media only screen and (max-width: 980px) {
	.et_pb_menu_0_tb_header .mobile_nav .mobile_menu_bar:before {
		top: 8px;
	}
}

/* About page, mobile: show the portrait straight after the "Meet Corna Olivier" heading,
   then the bio, then the qualifications. The portrait lives in the same column as the
   qualifications, so flatten that column (display: contents) and reorder with flexbox. */
@media only screen and (max-width: 767px) {
	.page-id-15 .et_pb_row_1 {
		flex-direction: column;
	}
	.page-id-15 .et_pb_row_1 > .et_pb_column_2 {
		display: contents;
	}
	.page-id-15 .et_pb_row_1 .et_pb_image_0 {
		order: -1;
		width: 100%;
	}
}