Free CSS: Three column hamburger menu as a "mega menu"

#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-container > div {
	background: url(https://cdn5.dcbstatic.com/files/i/m/impactnetworking_docebosaas_com/userfiles/13045/learn.gif) no-repeat center;
    background-size: contain;
	position: relative;
}/*grow explore connect in hamburger popup*/

#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-container > div > div.user-menu-details-top-wrapper > div > ui-button-link > button {
    visibility: hidden !important;
    display: none !important;
}/*no signout in hamburger*/

#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-container > div > div.user-menu-details-bottom-wrapper > div {
    visibility: hidden !important;
    display: none !important;
}/*no username in hamburger*/
#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-container > div > div.user-menu-details-bottom-wrapper > ui-button-icon {
    visibility: visible !important;
    display: block !important;
}/*no edit profile button in hamburger*/

#doc-layout-header-fixed > div.doc-layout-overlay.is-visible {
    opacity: 30% !important;
}/*UXUI opacity when menu is open*/

#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-container > nav > ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-container > div {
    height: 3em;
}
/*   visibility: hidden !important;
    display: none !important;
}/*hide top red in hamburger popup; note this hides the logout link*/

#doc-widget-45 > myprofile-widget > div > div > div.cover {
    background-color: transparent !important;
}/*hide top red in hamburger popup*/


#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-container > div > div.user-menu-details-top-wrapper > ui-avatar {
    visibility: hidden !important;
    display: none !important;
}/*hide avatar in hamburger popup*/

#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-header{
    visibility: hidden !important;
    display: none !important;
}/*no header in hamburger*/
#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div > div.user-menu-footer-wrapper.ng-star-inserted {
    visibility: hidden !important;
    display: none !important;
}/*no footer in hamburger*/

/*#doc-layout-user-menu > div.user-menu-wrapper.ui-shadow-md.user-menu-open*/ 
#doc-layout-user-menu > dcb-ui-trap > div > div > div:nth-child(2) > div.user-menu-open{
    margin-top: 6em;
    margin-left: 15%;
    margin-right: 15%;
    margin-bottom: 15%;
    width: 70%;
    height: fit-content;
}/*larger hamburger when opened - and centered please!*/


#ui-button-icon-2 {
	background: url(https://cdn5.dcbstatic.com/files/i/m/impactnetworking_docebosaas_com/userfiles/13045/growexploreconnect_alphatest__1_.png) no-repeat center;
    background-size: contain;
	position: relative;
    width: 500px !important;
    height: 5.5em !important;
    margin-left: 4em;
    margin-right: 1em;
}/*hamburger button image swap*/
#ui-button-icon-2 > ui-icon > span > svg {
    visibility: hidden;
}/*hide default hamburger button*/


#doc-layout-internal-header > div.internal-header-main-elements > div.internal-header-logo > a > img {
    max-height: 200%;
}/*larger home button image (impact logo)*/

/*gold gamification icon*/
.internal-header-gamification ui-button-icon button ui-icon span.color-neutral svg {fill: #FFD700;}
/*blue robot icon*/
.internal-header-virtual-coach ui-button-icon button ui-icon span.color-neutral svg {fill: #ff0000;}

ui-icon.ui-icon-size-sm {
	transform: scale(2);
}/*larger header icons*/



div.global-search-boxed-wrapper ui-icon span.color-negative svg {
	/*fill: white;*/
	transform: scale(1.3);
}/*larger search icon*/


#doc-layout-global-search-boxed > div > div.global-search-boxed-form > div.global-search-boxed-input {
    font-size: 160%;
}/*larger searchbox font*/

#doc-layout-header-fixed, #doc-layout-header-bar, #doc-layout-internal-header {
    height: 6em !important;
    background-color: #fefefe;
}/*taller header*/

#doc-layout-internal-header > div.internal-header-main-elements {
    flex-direction: row-reverse;
}/*home button to left of grow-connect-explore*/

/*#doc-layout-page-content > doc-layout-legacy-wrapper > div > */
ui-spinner > div > div.ui-spinner-layer, div.hyd-spinner-layer {
    /*border-style: hidden !important;*/
    border-color: transparent !important;/*hide spinner to show image*/
    background-size: cover !important;
    background-image: url(https://cdn5.dcbstatic.com/files/i/m/impactnetworking_docebosaas_com/userfiles/13045/40px_spinner.png);
}/*colorize and theme spinner*/
ui-spinner > div > div.ui-spinner-layer > ui-spinner-circle-clipper, div.hyd-spinner-circle-clipper {
    border-color: transparent;
}/*hide spinner to show image*/


/*enrollments-list-deprecated blankslate div.blank-slate-image img{
	visibility: hidden;
}
enrollments-list-deprecated blankslate div.blank-slate-image{
	background: url(https://docebo-institute.s3.us-east-2.amazonaws.com/public/branding_hacks/no-courses.png) no-repeat center;
    background-size: contain;
	position: relative;
}/*sample code to reskin no enrollments blankslate*/


#content > div.authoring_wrap.en > h1::after {
	content: " - special characters in filenames may cause errors";
}/*warning for slide converter*/


#doc-layout-title-bar {
    visibility: hidden !important;
    display: none !important;
}/* hide titlebars*/

#doc-layout-breadcrumbs {
    visibility: hidden !important;
    display: none !important;
}/* hide breadcrumb*/
#action-buttons-id {
    margin-top: 2em;
}/*move circle buttons downward so they aren't hidden by header*/

#doc-widget-45 > myprofile-widget > div > div > div.cover > div > div.details-container > div.fullName {
    margin-top: -1em;
    margin-left: 1em;
    color: #0D0C0C;
    font-family: "Bebas Neue Pro", sans-serif;
    font-size: 9.875rem;
    font-weight: 700;
    text-transform: uppercase;
}
#doc-widget-45 > myprofile-widget > div > div > div.cover > div > div.avatar-container {
    margin-top: -600;
}/* move name north on homepage*/
#doc-widget-45 > myprofile-widget > div > div > div.widget-actions-container, #doc-widget-45 > myprofile-widget > div > div > div.cover > div > div.avatar-container > avatar {
    visibility: hidden !important;
    display: none !important;
}/*hide avatar and more actions*/

#doc-widget-45 {
    margin-bottom: 0;
    height: 0;
}


/*hide white signin footer 
footer.doc-layout-footer { display: none !important; }*/

/*
#vertical-tab-contentPartnersApp {
	visibility: hidden;
    display: none;
} /*hide content partners tab for users*/

.container {
width: 90%;
}/*make legacy pages wider - less white space on sides*/






div#admin_menu_main_div div.mdl-grid div.right-panel {
	margin-top:5px !important;
}/*fix misaligned headers on admin menu*/
/*
div#admin_menu_main_div div.buttons-row div.admin-menu_wrap_btn-container span.rectangular-button-text span.icon-button {
	visibility: hidden;
}/*hide the icon buttons for the three top buttons in admin menu*/






.docebo-progress {
	transform: scaleY(4.0);
}/*fat progress bar*/


/*
.mdl-button {
	text-transform: none;
	transform: scale(1.1);
}/*get rid of mandatory uppercase for all buttons*/



/*ui-spinner > div > div.ui-spinner-layer, div.hyd-spinner-layer {
	border-color: transparent !important;/*hide spinner to show image*/
	/*background-size: cover !important;
	background-image: url(https://docebo-institute.s3.us-east-2.amazonaws.com/public/branding_hacks/logo40px.png);
}/*colorize and theme spinner*/
/*ui-spinner > div > div.ui-spinner-layer > ui-spinner-circle-clipper, div.hyd-spinner-circle-clipper {
	border-color: transparent;
}/*hide spinner to show image*/



i.material-icons{
	font-size: 30px !important;
    top: -5px;
    left: -5px;
}/*bigger icons*/

Thank you