/*	==========================================================================	
	
	AVATAR :: HUMAN CAPITAL FRONT END DEVELOPMENT STYLEGUIDE
	
	DEVELOPED BY: WAYDE THEUNISSEN 
	INITIALIZED: MAY 2021

	BASED ON DESIGNS BY: NATASHA AURET

	VERSION: 3.1

	DATE: AUGUST 2025			

	========================================================================== */

    /* :root */
    :root {
    
            /* General */
            --mm-powder-blue: #33B1DD;
            --mm-powder-blue-state: #009DD4;
            
            --mm-green: #4FBD88;
            --mm-green-state: #23AC6A;
        
            --mm-orange: #E6814E; 
            --mm-orange-state: #E06222;
        
            --mm-red: #E7494E;
            --mm-red-state: #E11B22;
        
            --mm-burnt-orange: #F1A85E;
            --mm-burnt-orange-state: #ED9236;        
        
            --mm-navy-blue: #003366;
            --mm-navy-blue-state: #002952;        
        
            --mm-bright-purple: #C84DAB;        
            --mm-dark-violet-state: #BA2096;        
        
            --mm-pink-rose: #D8498D;        
            --mm-pink-blush-state: #CE1C71;
        
        
            /* */
            --mm-scarlet-red: #E11B22;
        
            --mm-light-blue: #CCEBF6;        
            --mm-midnight-blue: #335c85;
        
            --mm-white: #ffffff;
        
            --mm-dark-grey: #333333;
            --mm-darker-grey: #333333;
        
            --mm-grey: #ececec;
            --mm-light-grey: #f8f8f8;
            --mm-lighter-grey: #dddddd;
            --mm-silver-grey: #bababa;
            --mm-steel-grey: #cccccc;
            --mm-dove-grey: #a0a0a0;
            /* */
        
            /* Fonts */
            --mm-font-stack: Calibri;
            --mm-default-font-color: #333333;
    }


	html, body {
		margin: 0;
		padding: 0;
		background-color: var(--mm-light-grey)!important;
 background: var(--mm-light-grey) !important;
		overflow-x: hidden;
		color: var(--mm-darker-grey)!important;
		font-family: var(--mm-font-stack);
		font-size: 16px;
        line-height: 1.4em;
	}

form {
        color: var(--mm-darker-grey)!important;
        font-family: var(--mm-font-stack)!important;
        font-size: 16px;
        line-height: 1.4em;    
    }

	a {	
		color: var(--mm-powder-blue);
		text-decoration: none;
	    transition: .5s all ease;
	}
 
	a:hover {
		color: var( --mm-powder-blue-state);
	}

	a:focus-visible {
		outline: none!important;
	}

	p {
		margin-top: 15px;
		margin-bottom: 15px;
	}

	ul {
		padding: 0;
		margin: 0;
	}

	li {
		list-style: none;	
	}

	h1 {
		font-size: 28px;	
	}	

	h2 {
		font-size: 24px;	
	}

	h3 {
		font-size: 20px;	
	}

	h4 {
		font-size: 16px;	
}

	pre {
		font-size: 14px;
		white-space: pre-line;
		font-weight: normal;
		margin: 0;
	}

	figure {
		margin: 0!important;
	}

	button,
	.button,
	a.button,
	li.button,
	div.button,
	.button a {
		min-width: 250px;
		height: auto;
		max-height: 40px;
		padding: 8px 10px;
		text-align: center;
		font-size: 16px;
		font-weight: 500;
		font-family: var(--mm-font-stack);
		margin-left: 15px; 
		border: 2px solid transparent;
		cursor: pointer;
		width: auto;
		transition: .5s all ease;
		border-radius: 20px;
		background-image: none!important;
		text-shadow: none!important;	
		margin-bottom: 1px;
		display: inline-flex;	
		justify-content: center;
		align-items: center;
        letter-spacing: .02em;    
	}

	button,
	.button,
	a.button {
		-webkit-box-shadow: 0px 6px 8px -2px rgba(65,65,65,0.4);
		-moz-box-shadow: 0px 6px 8px -2px rgba(65,65,65,0.4);
		box-shadow: 0px 6px 8px -2px rgba(65,65,65,0.4);		
	}

	button img,
	a.button img {
		margin-right: 8px;
	}

	a.button {
		text-decoration: none;
		margin-left: 0;
	}

	.button a {
		width: 100%;
		padding: 0!important;
		border: 0!important;
		margin: 0!important;	
	}

	input, select, textarea, button {
		outline : none;
		font-family: var(--mm-font-stack);
	}

	
/*	==========================================================================	

			GENERAL CLASSES 

	========================================================================== */

	.ps_apps_content {
		padding: 0!important;
	}

	.container_wrapper_1920 {
		max-width: 1920px;
	}

	.container_wrapper,
	.container_wrapper_1600 {
		max-width: 1600px;
	}

	.container_wrapper_1360 {
		max-width: 1360px;
	}

	.container_wrapper_1320 {
		max-width: 1320px;
	}

	.container_wrapper_1300 {
		max-width: 1300px;
	}

	.container_wrapper_1240 {
		max-width: 1240px;
	}

	.container_wrapper_1200 {
		max-width: 1200px;
	}

	.fluid-container {
		padding: 0 15px;
	}


	/* Float */
	.float-left {
		float: left;
	}

	.float-right {
		float: right;
	}

	.float-none {
		float: none;
	} 


	/* Text Positioning */
	.text-center {
		text-align: center!important;	
	}

	.text-left {
		text-align: left!important;	
	}

	.text-right {
		text-align: right!important;	
	}


	/* Text Transformation */
	.text-no-case {
		text-transform: none!important;
	}

	.text-upper-case {
		text-transform: uppercase!important;
	}

	.text-capitalize-case {
		text-transform: capitalize!important;
	}

	.text-underline {
		text-decoration: underline;
	}


	/* Text Colors // Text Drop Shadow */
	.white-text {
		color: var(--mm-white);
	}	

	.blue-text {
		color: var(--mm-powder-blue);
	}

	.light-blue-text {
		color: var( --mm-powder-blue-state);
	}

    .dark-blue-text {
        color: var(--mm-navy-blue);
    }

	.orange-text {
		color: var(--mm-orange-state);
	}

	.color-red,
	.red-text {
		color: var(--mm-red);
	}

	.dark-red-text {
		color: var(--mm-red-state);
	}

	.green-text {
		color: var(--mm-green);       
	}

	.light-green-text {
		color:var(--mm-green-state) ;        
	}

	.text-shadow-grey {
		text-shadow: 1px 1px var(--mm-lighter-grey);
	}


	/* Validation Border */
	.red-border {
		border: 1px solid var(--mm-red);
	}


	/* Borders // Dividers */
.mm-powder-blue-border-2 {
        border: 2px solid var(--mm-powder-blue);
     }  

	.mm-grey-border {
		border: 1px solid #ececec;
	}

	.mm-light-grey-border {
		border: 1px solid var(--mm-light-grey);
	}
    
    .light-grey-bottom-border {
		border-bottom: 1px solid var(--mm-light-grey);
	}

	.light-grey-bottom-border {
		border-bottom: 1px solid var(--mm-light-grey);
	}

	.light-grey-top-border {
		border-top: 1px solid var(--mm-light-grey);
	}

    .mm-lighter-grey-border {
        border: 1px solid var(--mm-lighter-grey);
     }    

    .mm-lighter-grey-bottom-border {
        border-bottom: 1px solid var(--mm-lighter-grey);
     }  

	.orange_divider_bottom {
		border-bottom: 2px solid var(--mm-orange);
	}


	/* Colored Circles - Filled */
	.red-circle {
		width: 20px;
		height: 20px;
		background-color: var(--mm-red);
		border-radius: 50%;
		display: block;
	}

	.green-circle {
		width: 20px;
		height: 20px;
		background-color: var(--mm-green);
		border-radius: 50%;	
		display: block;
	}

	.dark-green-circle,
    .powder-blue-circle {
		width: 20px;
		height: 20px;
		background-color: var( --mm-powder-blue-state);
		border-radius: 50%;
		display: block;
	}

	.dark-grey-circle {
		width: 20px;
		height: 20px;
		background-color: var(--mm-dark-grey);
		border-radius: 50%;
		display: block;
	}

	.orange-circle {
		width: 20px;
		height: 20px;
		background-color: var(--mm-orange);
		border-radius: 50%;
		display: block;
	}

	.teal-circle {
		width: 20px;
		height: 20px;
		background-color: var(--mm-powder-blue);
		border-radius: 50%;
		display: block;
	}


	/* Element Positioning */
	.pos-relative {
		position: relative;
	}

	.pos-absolute {
		position: absolute;
	}
	
	.pos-fixed {
		position: fixed;
	}

	.pos-static {
		position: static;
	}

	.pos-sticky {
		position: sticky;
	}


	/* Font Weights // Font Styles */
	.font-italic {
		font-style: italic;
	}

	.font-style-normal {
		font-style: normal;
	}

	.font-light {
		font-weight: lighter!important;
	}

	.font-normal {
		font-weight: normal;
	}

	.font-500 {
		font-weight: 500;	
	}

	.font-600 {
		font-weight: 600;	
	}

	.font-700 {
		font-weight: 700;	
	}

	.font-bold {
		font-weight: bold;	
	}	
	
	.font-underline {
		text-decoration: underline;
	}


	/* Image Responsiveness */
	.img-responsive {
		width: 100%;
	}
	

	/* Element Wrapping */
	.clear-both {
		clear: both;
	}

	.clear-left {
		clear: left;
	}

	.clear-right {
		clear: right;
	}


    /* Opacity */
    .opacity-0 {
        opacity: 0;
    }

    .opacity-01 {
        opacity: .1;
    }
    
    .opacity-02 {
        opacity: .2;
    }
    
    .opacity-03 {
        opacity: .3;
    }
    
    .opacity-04 {
        opacity: .4;
    }

    .opacity-05 {
        opacity: .5;
    }

    .opacity-06 {
        opacity: .6;
    }

    .opacity-07 {
        opacity: .7;
    }

    .opacity-08 {
        opacity: .8;
    }

    .opacity-09 {
        opacity: .9;
    }


	/* Button Positioning */
	.button-container-right {
		float: right;
	}

	.button-container-left {
		float: left;
	}

	.button-container-responsive {
		display: flex;
		justify-content: flex-end;
	}

	
	/* Desktop Display Elements */
	.desktop-display-none {
		display: none;
	}

	.desktop-display-flow-root {
		display: flow-root;
	}

	.desktop-display-block {
		display: block;
	}

	.desktop-display-inline {
		display: inline;
	}

	.desktop-display-inline-block {
		display: inline-block;
	}

	.desktop-display-flex {
		display: flex;
	}

	.desktop-display-inline-flex {
		display: inline-flex;
	}

	.desktop-display-flex-center {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.desktop-display-flex-vcenter {
		display: flex;
		align-items: center!important;
	}

	.desktop-display-flex-hcenter {
		display: flex;
		justify-content: center!important;	
	}

	.desktop-display-flex-hend {
		display: flex;
		justify-content: end!important;	
	}

	.desktop-display-flex-hstart {
		display: flex;
		justify-content: start!important;	
	}

	.desktop-display-space-between {
	  display: flex;
	  justify-content: space-between!important;
	  align-items: center;
	}

	.desktop-display-space-evenly {
	  display: flex;
	  justify-content: space-evenly;
	  align-items: center;
	}

	
	/* Flex Attributes */
	.flex-column {
		flex-direction: column;
	}

	.flex-row-space-between {
		justify-content: space-between;	
	}

	.flex-row-space-between li:first-child {
		align-items: center;
	}


	/* Widths */
	.mm-width-auto {
		width: auto!important;
	}

	.mm-width-100 {
		min-width: 100px!important;
	}

	.mm-width-200 {
		min-width: 200px!important;
	}
	
	.mm-width-300 {
		min-width: 300px!important;	
	}

	.mm-width-100-p {
		width: 100%!important;
	}


	/* Disabled Elements */
	/*.mm-disabled,*/
	/*.mm-disabled form,*/
	.mm-disabled input,
	.mm-disabled select,
	.mm-disabled textarea,
	/*.mm-disabled .form-container,*/
	.mm-disabled-content {
		outline: none;
		pointer-events: none;
		filter: grayscale(100%);
background-color: var(--mm-grey);
background: var(--mm-grey);
	}
	
/*	.mm-disabled,*/
	.mm-disabled select,
	.mm-disabled textarea, 
	.mm-disabled .form-container,
	.mm-disabled-content {
background-color: var(--mm-grey)!important;
background: var(--mm-grey)!important;
	}

	.mm-disabled,
	.mm-disabled label,
	.mm-disabled input,
	.mm-disabled .form-container,
	.mm-disabled-content {
		opacity: 1;	
	}

	.mm-disabled textarea {
		pointer-events: auto;
	}

	.mm-label-container.mm-disabled,
	.mm-input-container.mm-disabled,
	.mm-slider.mm-disabled,
	.mm-switch-block.mm-disabled {
/*		opacity: .6;*/
		background-color: transparent!important;
		filter: grayscale(100%);
	}

	.mm-disabled-brightness {
		outline: none;
		pointer-events: none;
		filter: brightness(0.6);
	}

	.mm-disabled-contrast {
		outline: none;
		pointer-events: none;
		filter: opacity(0.6);
	}

.content-disabled {
        outline: none;
        pointer-events: auto;
        /* filter: grayscale(100%);*/
	background-color: var(--mm-grey)!important;
        background: var(--mm-grey)!important;  
    }


	/* Inactive Content */
	.mm-inactive-content {
		width: auto;
		min-height: 20px;
		padding: .6em 10px;	
	}


	/* Border Elements */
	.mm-border {
		border: 2px solid var(--mm-silver-grey)!important;	
		border-radius: 4px!important;	
	}

	.mm-border-0 {
		border: 0!important;
		border-radius: 0!important;
	}

	.mm-border-4 {
		border: 0!important;
		border-radius: 4px!important;
	}

	.mm-border-radius-0 {
		border-radius: 0!important;	
	}

	.mm-border-radius-10 {
		border-radius: 10px!important;	
	}

	.mm-border-radius-20 {
		border-radius: 20px!important;	
	}

	.mm-border-radius-30 {
		border-radius: 30px!important;	
	}

	.mm-border-radius-40 {
		border-radius: 40px!important;	
	}

	.mm-border-radius-top-0 {
		border-top-right-radius: 0!important;
		border-top-left-radius: 0!important;	
	}

	.mm-border-radius-bottom-0 {
		border-bottom-right-radius: 0!important;
		border-bottom-left-radius: 0!important;	
	}

	.mm-border-radius-bottom-10 {
		border-radius: 0 0 10px 10px!important;
	}

	.mm-border-radius-top-10 {
		border-radius: 10px 10px 0 0!important;
	}

	.mm-border-transparent {
		border: transparent!important;
	}

	.mm-list-row-padding {
		padding-top: 10px !important;
		padding-bottom: 10px !important;
		height: 20px !important;
	}


	/* Alternate Background // Border Color Values */
	.mm-white-background {
		background-color: var(--mm-white);
	}

	.mm-grey-background {
		background-color: var(--mm-grey);
	}

	.mm-light-grey-background {
		background-color: var(--mm-light-grey);
	}

	.mm-lighter-grey-background {
		background-color: var(--mm-lighter-grey);
	}

	.mm-light-blue-background {
		background-color: var(--mm-light-blue);
	}

	.mm-orange-background {
		background-color: var(--mm-orange)!important;
	}

	.mm-green-top-border {
		background-color: var(--mm-green);
		height: 10px;
		width: 100%;
	}


	/* Content Background Color Values */
	.mm-content-grey-background {
		background-color: var(--mm-light-grey);
		border-radius: 4px;
		padding: 20px;
	}


	/* Ellipsis Content Overflow */
	.mm-single-ellipsis {
		text-overflow: ellipsis;
		overflow: hidden!important;
		white-space: nowrap;
		display: block;
	}

	.mm-block-ellipsis {
		display: block;
		display: -webkit-box;
		line-height: 22px;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		text-overflow: ellipsis;
	}


	/* Box Shadow */
	.mm-box-shadow-none {
		-webkit-box-shadow: none!important; 
		-moz-box-shadow: none!important; 
		box-shadow: none!important;		
	}

	.mm-box-shadow {
		-webkit-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
		-moz-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
		box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
	}

	.mm-box-shadow-inset {
		-webkit-box-shadow: 0px 2px 8px -2px inset rgba(221,221,221,1);
		-moz-box-shadow: 0px 2px 8px -2px inset rgba(221,221,221,1);
		box-shadow: 0px 2px 8px -2px inset rgba(221,221,221,1);
	}	

	.mm-content-container {
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		padding: 20px;
		background-color: var(--mm-white);
		margin-top: 40px;
	}



/*	==========================================================================	

			ARROWS 

	========================================================================== */

	.mm-arrow {
		border: 1px solid var(--mm-white);
		border-width: 0 2px 2px 0;
		display: inline-block;
		padding: 4px;
		z-index: 1;
		position: absolute;		
	}

	.mm-arrow-right {
		transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}

	.mm-arrow-left {
		transform: rotate(135deg);
		-webkit-transform: rotate(135deg);
	}

	.mm-arrow-up {
		transform: rotate(-135deg);
		-webkit-transform: rotate(-135deg);
	}

	.mm-arrow-down {
		transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
	}


/*	==========================================================================	

			ICONS 

	========================================================================== */

	.input-icon {
		position: absolute;
		right: 10px;
		top: 10px;
		width: 20px;
		height: 20px;
	}

	.button-icon {
		position: absolute;
		left: 15px;
		top: 6px;
		width: 25px;
		height: 25px;
	}


/*	==========================================================================	

			MARGINS

	========================================================================== */

	.mm-m-auto {
		margin: 0 auto;
	}

	.mm-m-0 {
		margin: 0!important;
	}

	/* margin-left */
	.mm-ml-0 {
		margin-left: 0!important;
	}

	.mm-ml-10 {
		margin-left: 10px!important;
	}

	.mm-ml-20 {
		margin-left: 20px!important;
	}

	.mm-ml-30 {
		margin-left: 30px!important;
	}

	.mm-ml-40 {
		margin-left: 40px!important;
	}

	.mm-ml-50 {
		margin-left: 50px!important;
	}

	/* margin-right */
	.mm-mr-0 {
		margin-right: 0!important;
	}

	.mm-mr-10 {
		margin-right: 10px!important;
	}

	.mm-mr-20 {
		margin-right: 20px!important;
	}

	.mm-mr-30 {
		margin-right: 30px!important;
	}

	.mm-mr-40 {
		margin-right: 40px!important;
	}

	.mm-mr-50 {
		margin-right: 50px!important;
	}

	/* margin-top */
	.mm-mt-0 {
		margin-top: 0!important;
	}

	.mm-mt-10 {
		margin-top: 10px!important;
	}

	.mm-mt-20 {
		margin-top: 20px!important;
	}

	.mm-mt-30 {
		margin-top: 30px!important;
	}

	.mm-mt-40 {
		margin-top: 40px!important;
	}

	.mm-mt-50 {
		margin-top: 50px!important;
	}

	/* margin-bottom */
	.mm-mb-0 {
		margin-bottom: 0!important;
	}

	.mm-mb-10 {
		margin-bottom: 10px!important;
	}

	.mm-mb-20 {
		margin-bottom: 20px!important;
	}

	.mm-mb-30 {
		margin-bottom: 30px!important;
	}

	.mm-mb-40 {
		margin-bottom: 40px!important;
	}

	.mm-mb-50 {
		margin-bottom: 50px!important;
	}



/*	==========================================================================	

			PADDING

	========================================================================== */

	.mm-p-0 {
		padding: 0!important;
	}

	/* padding-left */
	.mm-pl-0 {
		padding-left: 0!important;
	}

	.mm-pl-10 {
		padding-left: 10px!important;
	}

	.mm-pl-20 {
		padding-left: 20px!important;
	}

	.mm-pl-30 {
		padding-left: 30px!important;
	}

	.mm-pl-40 {
		padding-left: 40px!important;
	}

	.mm-pl-50 {
		padding-left: 50px!important;
	}

	/* padding-right */
	.mm-pr-0 {
		padding-right: 0!important;
	}

	.mm-pr-10 {
		padding-right: 10px!important;
	}

	.mm-pr-20 {
		padding-right: 20px!important;
	}

	.mm-pr-30 {
		padding-right: 30px!important;
	}

	.mm-pr-40 {
		padding-right: 40px!important;
	}

	.mm-pr-50 {
		padding-right: 50px!important;
	}

	/* padding-top */
	.mm-pt-0 {
		padding-top: 0!important;
	}

	.mm-pt-10 {
		padding-top: 10px!important;
	}

	.mm-pt-20 {
		padding-top: 20px!important;
	}

	.mm-pt-30 {
		padding-top: 30px!important;
	}

	.mm-pt-40 {
		padding-top: 40px!important;
	}

	.mm-pt-50 {
		padding-top: 50px!important;
	}

	/* padding-bottom */
	.mm-pb-0 {
		padding-bottom: 0!important;
	}

	.mm-pb-10 {
		padding-bottom: 10px!important;
	}

	.mm-pb-20 {
		padding-bottom: 20px!important;
	}

	.mm-pb-30 {
		padding-bottom: 30px!important;
	}

	.mm-pb-40 {
		padding-bottom: 40px!important;
	}

	.mm-pb-50 {
		padding-bottom: 50px!important;
	}



/*	==========================================================================	

			FORM FIELDS 

	========================================================================== */

	.form_layout, 
	.form_checkbox_layout {
		width: auto;
		/*padding-left: 20px;
		padding-right: 20px;*/
		border-radius: 10px;
		display: flex;
		justify-content: space-between;
	}

	.form_layout li {
		width: 48%;
		display: inline-grid;
	}

	.form_checkbox_layout li {
		width: 100%;
		display: inline-block;
	}

	.form_layout .mm-row-form {
		max-width: 350px;
		display: inline-flex;
		width: 100%;
	}

	.form_layout label {
		max-width: 250px;		
		width: 100%;
		display: inline-block;
	}


	/* Form List */
	.mm-form-list li {
		width: 45%;
	}

	.mm-form-list label {
		max-width: 250px!important;
	}

	
	/* Label Icon Wrapper */
	.label-icon {
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
		max-width: 230px;
		width: 100%;
		padding-right: 10px;
	}



/*	==========================================================================	

			STANDARD BUTTONS 

	========================================================================== */

	.primary-button {
		background-color: var(--mm-powder-blue);
		color: var(--mm-white);
	}
	
	.primary-button:hover,
	.primary-button:focus, 
	.primary-button:active {
		background-color: var( --mm-powder-blue-state);
		color: var(--mm-white)!important;
	}

	.secondary-button {
		background-color: var(--mm-green);
		color: var(--mm-white);
	}
	
	.secondary-button:hover,
	.secondary-button:focus, 
	.secondary-button:active {
		background-color: var(--mm-green-state);
		color: var(--mm-white)!important;
	}

	.tertiary-button {
		background-color: var(--mm-orange);
		color: var(--mm-white);	
	}
	
	.tertiary-button:hover,
	.tertiary-button:focus, 
	.tertiary-button:active {
		background-color: var(--mm-orange-state);
		color: var(--mm-white)!important;
	}

	.quaternary-button {
		background-color: var(--mm-red);
		color: var(--mm-white);	
	}

	.quaternary-button:hover,
	.quaternary-button:focus, 
	.quaternary-button:active {
		background-color: var(--mm-red-state);
		color: var(--mm-white)!important;
	}

	.quinary-button {
		background-color: var(--mm-burnt-orange);
		color: var(--mm-white);	
	}

	.quinary-button:hover,
	.quinary-button:focus, 
	.quinary-button:active {
		background-color: var(--mm-burnt-orange-state);
		color: var(--mm-white)!important;
	}

	.senary-button {
		background-color: var(--mm-navy-blue);
		color: var(--mm-white);	
	}

	.senary-button:hover,
	.senary-button:focus, 
	.senary-button:active {
		background-color: var(--mm-navy-blue-state);
		color: var(--mm-white)!important;
	}


	/*  Standard Buttons - Hyperlink Anchor */
	.primary-button a,
	.secondary-button a,
	.tertiary-button a,
	.quaternary-button a {
		color: var(--mm-white)!important;
	}


	/*  Standard Buttons - Anchor First Hyperlink */
	a.primary-button {
		background-color: var(--mm-powder-blue);
		color: var(--mm-white);
	}
	
	a.primary-button:hover,
	a.primary-button:focus, 
	a.primary-button:active {
		background-color: var( --mm-powder-blue-state);
		color: var(--mm-white)!important;
	}

	a.secondary-button {
		background-color: var(--mm-green);
		color: var(--mm-white)!important;
	}
	
	a.secondary-button:hover,
	a.secondary-button:focus, 
	a.secondary-button:active {
		background-color: var(--mm-green-state);
		color: var(--mm-white)!important;
	}

	a.tertiary-button {
		background-color: var(--mm-orange);
		color: var(--mm-white);	
	}
	
	a.tertiary-button:hover,
	a.tertiary-button:focus, 
	a.tertiary-button:active {
		background-color: var(--mm-orange-state);
		color: var(--mm-white)!important;
	}

	a.quaternary-button {
		background-color: var(--mm-red);
		color: var(--mm-white);	
	}

	a.quaternary-button:hover,
	a.quaternary-button:focus, 
	a.quaternary-button:active {
		background-color: var(--mm-red-state);
		color: var(--mm-white)!important;
	}

	a.quinary-button {
		background-color: #EE9C49;
		color: var(--mm-white);	
	}

	a.quinary-button:hover,
	a.quinary-button:focus, 
	a.quinary-button:active {
		background-color: var(--mm-burnt-orange-state);
		color: var(--mm-white)!important;
	}

	a.senary-button {
		background-color: var(--mm-navy-blue);
		color: var(--mm-white);	
	}

	a.senary-button:hover,
	a.senary-button:focus, 
	a.senary-button:active {
		background-color: var(--mm-navy-blue-state);
		color: var(--mm-white)!important;
	}



/*	==========================================================================	

			INVERTED BUTTONS

	========================================================================== */

	.primary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-powder-blue);
		border: 2px solid var(--mm-powder-blue)!important;
	}

	.primary-button-inverted a {	
		color: var(--mm-powder-blue)!important;
	}
	
	.primary-button-inverted:hover,
	.primary-button-inverted:focus, 
	.primary-button-inverted:active {
		background-color: #CCEDF2;
		color: var(--mm-powder-blue);
		border: 2px solid var(--mm-powder-blue)!important;
	}

	.secondary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-green);
		border: 2px solid var(--mm-green)!important;
	}

	.secondary-button-inverted a {	
		color: var(--mm-green)!important;
	}
	
	.secondary-button-inverted:hover,
	.secondary-button-inverted:focus, 
	.secondary-button-inverted:active {
		background-color: #CCF2ED;
		color: var(--mm-green);
		border: 2px solid var(--mm-green);
	}

	.tertiary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-orange);	
		border: 2px solid var(--mm-orange)!important;
	}

	.tertiary-button-inverted a {
		color: var(--mm-orange)!important;	
	}
	
	.tertiary-button-inverted:hover,
	.tertiary-button-inverted:focus, 
	.tertiary-button-inverted:active {
		background-color: #FEF3ED;
		color: var(--mm-orange);	
		border: 2px solid var(--mm-orange);
	}

	.quaternary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-red);
		border: 2px solid var(--mm-red)!important;		
	}

	.quaternary-button-inverted a {
		color: var(--mm-red)!important;	
	}

	.quaternary-button-inverted:hover,
	.quaternary-button-inverted:focus, 
	.quaternary-button-inverted:active {
		background-color: #FCE8E8;
		color: var(--mm-red);	
		border: 2px solid var(--mm-red);
	}

	.quinary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-burnt-orange);
		border: 2px solid var(--mm-burnt-orange)!important;		
	}

	.quinary-button-inverted a {
		color: var(--mm-burnt-orange)!important;	
	}

	.quinary-button-inverted:hover,
	.quinary-button-inverted:focus, 
	.quinary-button-inverted:active {
		background-color: #fef3e2;
		color: var(--mm-burnt-orange);	
		border: 2px solid var(--mm-burnt-orange);
	}

	.senary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-navy-blue);
		border: 2px solid var(--mm-navy-blue)!important;		
	}

	.senary-button-inverted a {
		color: var(--mm-navy-blue)!important;	
	}

	.senary-button-inverted:hover,
	.senary-button-inverted:focus, 
	.senary-button-inverted:active {
		background-color: #D9F2F5;
		color: var(--mm-navy-blue);	
		border: 2px solid var(--mm-navy-blue);
	}


	/*  Inverted Buttons - Hyperlink */
	a.primary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-powder-blue);
		border: 2px solid var(--mm-powder-blue)!important;
	}
	
	a.primary-button-inverted:hover,
	a.primary-button-inverted:focus, 
	a.primary-button-inverted:active {
		background-color: #CCEDF2;
		color: var(--mm-powder-blue);
		border: 2px solid var(--mm-powder-blue)!important;
	}

	a.secondary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-green);
		border: 2px solid var(--mm-green);
	}
	
	a.secondary-button-inverted:hover,
	a.secondary-button-inverted:focus, 
	a.secondary-button-inverted:active {
		background-color: #CCF2ED;
		color: var(--mm-green);
		border: 2px solid var(--mm-green);
	}

	a.tertiary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-orange);	
		border: 2px solid var(--mm-orange);
	}
	
	a.tertiary-button-inverted:hover,
	a.tertiary-button-inverted:focus, 
	a.tertiary-button-inverted:active {
		background-color: #FEF3ED;
		color: var(--mm-orange);	
		border: 2px solid var(--mm-orange);
	}


	a.quaternary-button-inverted {
		background-color: var(--mm-white);
		color: var(--mm-red);
		border: 2px solid var(--mm-red);		
	}

	a.quaternary-button-inverted:hover,
	a.quaternary-button-inverted:focus, 
	a.quaternary-button-inverted:active {
		background-color: #FCE8E8;
		color: var(--mm-red);	
		border: 2px solid var(--mm-red);
	}



/*	==============================

		PEOPLESOFT OVERRIDES 

	==============================	*/

	.ps-button:hover, 
	.ps-button:link:hover {
		outline: none!important;
	}



/*	=======================================

		PEOPLESOFT BUTTON CONFIGURATION

	=======================================	*/
	/* Standard Buttons */

	.primary-button a {
		background-color: var(--mm-powder-blue)!important;
		border-radius: 20px!important;
		outline: none!important;
	}
	.primary-button a:hover {
		background-color: var( --mm-powder-blue-state)!important;
		border-radius: 20px!important;
		outline: none!important;
	}

	.secondary-button a {
		background-color: var(--mm-green)!important;
		border-radius: 20px!important;
		outline: none!important;
	}
	.secondary-button a:hover {
		background-color: var(--mm-green-state)!important;
		border-radius: 20px!important;
		outline: none!important;
	}

	.tertiary-button a {
		background-color: var(--mm-orange)!important;
		border-radius: 20px!important;
		outline: none!important;
	}
	.tertiary-button a:hover {
		background-color: var(--mm-orange-state)!important;
		border-radius: 20px!important;
		outline: none!important;
	}

	.quaternary-button a {
		background-color: var(--mm-red)!important;
		border-radius: 20px!important;
		outline: none!important;
	}
	.quaternary-button a:hover {
		background-color: var(--mm-red-state)!important;
		border-radius: 20px!important;
		outline: none!important;
	}

	.quinary-button a {
		background-color: var(--mm-burnt-orange)!important;
		border-radius: 20px!important;
		outline: none!important;
	}
	.quinary-button a:hover {
		background-color: var(--mm-burnt-orange-state)!important;
		border-radius: 20px!important;
		outline: none!important;
	}

	.senary-button a {
		background-color: var(--mm-navy-blue)!important;
		border-radius: 20px!important;
		outline: none!important;
	}
	.senary-button a:hover {
		background-color: var(--mm-navy-blue-state)!important;
		border-radius: 20px!important;
		outline: none!important;
	}



	/* Inverted Buttons */
	.primary-button-inverted a:hover {
		background-color: transparent!important;
		outline: none!important;
	}

	.secondary-button-inverted a:hover {
		background-color: transparent!important;
		outline: none!important;
	}

	.tertiary-button-inverted a:hover {
		background-color: transparent!important;
		outline: none!important;
	}

	.quaternary-button-inverted a:hover{
		background-color: transparent!important;
		outline: none!important;
	}

	.quinary-button-inverted a:hover {
		background-color: transparent!important;
		outline: none!important;
	}

	.senary-button-inverted a:hover {
		background-color: transparent!important;
		outline: none!important;
	}



/*	=======================================

		PEOPLESOFT MODAL DEFAULT

	=======================================	*/
	.psc_modal-done .ps-button {
		border-color: var(--mm-powder-blue)!important;
		background: var(--mm-powder-blue)!important;	
	}

	.psc_modal-done .ps-button-wrapper:focus-visible {
		outline: none!important;
	}

	.ps_attach-loader .ps_attach-loadertext {
		margin: 0 0 10px;
	}

	.ps_attach-loader .ps-attach-loadcontainer {
		border: 1px solid var(--mm-powder-blue)!important;
		border-radius: 5px;
	}

	.ps_attach-loader .ps_attach-indicator {
		border: 0.25em solid var(--mm-powder-blue)!important;
		border-radius: 5px;
	}



/*	======================	

			PILLS

	====================== */

.mm-pills {
    display: flex;
    flex-wrap: wrap;
}

.mm-pills li {
    border-radius: 15px;
    min-height: 20px;
    max-height: 20px;
    margin-right: 20px;
    padding: 5px 20px;
    background-color: #dfdfdf;
    margin-top: 20px;
} 

.mm-pills li:nth-child(6),
.mm-pills li:nth-child(6) span {
    display: flex;
    align-items: center;
}

.mm-pills li:nth-child(6) span .green-circle,
.mm-pills li:nth-child(6) span .red-circle {
    width: 14px;
    height: 14px;
}



/*	==========================================================================	

			NAVIGATION

	========================================================================== */

	.mm-dropdown-button {
		padding: 0 15px;
		font-size: 16px;
		margin: 0;
		min-width: 225px;
		text-align: left;
		border: 2px solid var(--mm-powder-blue)!important;
		/* text-transform: none!important; */
		height: 40px;
	    justify-content: flex-start;
		font-weight: normal;
	}

	.mm-dropdown-button:hover {
		background-color: var(--mm-powder-blue);
		color: var(--mm-white);
		border: 1px solid var(--mm-powder-blue);
	}

	.mm-dropdown {
		position: relative;
		display: inline-block;
	}

	.mm-dropdown-content {
		display: none;
		position: absolute;
		background-color: var(--mm-white);
		min-width: 160px;
		z-index: 10;
		height: auto !important;
		border: 1px solid var(--mm-powder-blue)!important;
		margin-top: -1px;
	}

	.mm-dropdown-content li {
		border-bottom: 1px solid var(--mm-powder-blue);
		width: 100%; 
		display: inline-block;
	}
	
	.mm-dropdown-content li:last-child {
		border-bottom: 0;
	}

	.mm-dropdown-content a {
		color: var(--mm-powder-blue);	 
		padding: 12px 16px;
		text-decoration: none;
		display: block;
		margin: -1px;
	}

	.mm-dropdown-content a:hover {
		background-color: var(--mm-powder-blue);
		color: var(--mm-white);
		margin: -1px;
	}

	.mm-dropdown:hover .mm-dropdown-content,
	.mm-dropdown:hover .mm-select-element {
		display: block;
	}

	.mm-dropdown:hover .dropbtn {
		background-color: var(--mm-powder-blue);
		color: var(--mm-white);
	}



/*	==========================================================================	

			HEADERS

	========================================================================== */

	/* Main Header */
	.main-header {
		height: auto;
		max-height: 100px;
		background-color: var(--mm-white);
		-webkit-box-shadow: 0px 1px 8px 0px rgba(65,65,65,0.4); 
		-moz-box-shadow: 0px 1px 8px 0px rgba(65,65,65,0.4); 
		box-shadow: 0px 1px 8px 0px rgba(65,65,65,0.4); 		
	}

	.main-header .logo {
		margin: 0px auto;
		padding: 10px 0;
		max-height: 80px;
		max-width: 689px;
	}


	/* Secondary Header */
	.secondary-header {
		display: flex;
		background-color: var(--mm-navy-blue);
		min-height: 60px;
	}

	.secondary-header li {
		display: flex;
		align-items: center;
		border-right: 1px solid var(--mm-midnight-blue);
		padding-left: 15px;
		max-width: 295px;
		min-height: 60px;
		width: 100%;
	}

	.secondary-header li:first-child {
		padding-left: 0;
		max-width: 80px;
	}

	.secondary-header li:hover,
    .secondary-header li:hover a {
        background-color: var(--mm-light-blue);
        color: var(--mm-midnight-blue) !important;
	}

    .secondary-header li a:hover {
        background-color: transparent!important;
        color: var(--mm-midnight-blue) !important;
	}


	.secondary-header li:hover:first-child {
		background-color: transparent;
	}

	.secondary-header li.active,
	.secondary-header li.active a {
        background-color: var(--mm-light-blue);
        color: var(--mm-midnight-blue) !important;
	}

	.secondary-header li a {
		color: var(--mm-white);
	}


	/* Navigation Header Blue */
	.mm-navigation-header {
		background-color: var(--mm-navy-blue);
		min-height: 60px;
		height: auto;
		position: relative;
	}

	.mm-navigation-header li {
		display: flex;
		align-items: center;
		border-right: 1px solid var(--mm-midnight-blue);	
	}

	.mm-navigation-header li:last-child {
		border-right: 0;
	}

	.mm-navigation-header li.border-right {
		border-right: 1px solid var(--mm-midnight-blue)!important;
	}

	.mm-navigation-header .mm-dropdown-button {
		padding: 0 15px 0 15px;
		height: 60px;
		max-height: 60px;	
	}

	.mm-navigation-header .mm-dropdown-button, 
	.mm-navigation-header .mm-dropdown-button:hover {
		border: 0!important;
	}

	.mm-navigation-header .mm-dropdown.active .mm-dropdown-button {
		background-color: var(--mm-navy-blue);
	}

    .mm-navigation-header .primary-button {
        background-color: var(--mm-navy-blue);
    }

	.mm-navigation-header .mm-select-element {
		background-color: var(--mm-white);
		min-width: 300px;
		top: 60px;
		left: 0px;
		margin-top: 0;
		border: 0!important;	
        -webkit-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
        -moz-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);        
	}

	.mm-navigation-header .mm-select-element li {
		border-bottom: 1px solid #ccd6e0;
		border-right: 0;
        background-color: var(--mm-white) !important;
	}

	.mm-navigation-header .mm-select-element a {
		color: var(--mm-darker-grey);
		width: 100%;	
		min-height: 50px;
		padding: 0px 10px;
		display: flex;
		align-items: center;	
	}

	.mm-navigation-header .mm-select-element a:hover {
		background-color: var(--mm-light-blue);
		color: var(--mm-navy-blue);
		margin: 0;
		-webkit-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
		-moz-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
		box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);        
	}

	.mm-navigation-header .mm-selector-white::before {
		transform: rotate(0deg) translateY(0px);
		transition: transform .2s linear;
	}

    .mm-navigation-header .mm-selector-white:hover::before {
        transform: rotate(180deg) translateY(0px);
        transition: transform .2s linear;
    }

    .mm-navigation-header .mm-selector-white .primary-button {
        min-width: 300px;    
    }

    .mm-navigation-header .mm-selector-white:hover .primary-button,
	.mm-navigation-header .mm-dropdown .mm-dropdown-button:hover{
        text-decoration: underline;
        background-color: var(--mm-scarlet-red)!important;
        text-decoration-thickness: 2px;  
    }

	.mm-navigation-header .mm-selector-white.active::before {
        transform: rotate(180deg) translateX(-3px);
	}


	/* Navigation Header Search */
	.mm-navigation-search li {
		display: flex;
		width: 100%;
		max-height: 120px;
		position: relative;
		height: auto;
	}

	.mm-navigation-search-input {
		position: absolute;
		right: 0;
		top: 0;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		min-height: 60px;
		border: 0;	
	}

	.mm-navigation-search-input .sb-icon-search i {
		z-index: 1;
		position: absolute;
		margin: 0 5px;
		top: 16px;
		left: 4px;	
	}

	.header-home__icon_placement {
		display: flex; 
		justify-content: center; 
		align-items: center; 
		max-width: 80px; 
		width: 100%; 
		border-right: 1px solid var( --mm-powder-blue-state);	
	}

	.header-nav__page_title {
		display: flex; 
		justify-content: flex-start; 
		align-items: center; 
		max-width: 310px; 
		width: 100%; 
		border-right: 1px solid var( --mm-powder-blue-state); 
		color: var(--mm-white);	
	}

	.header-nav__page_title:hover {
        background-color: var(--mm-light-blue);
        color: var(--mm-midnight-blue);
		cursor: pointer;
	}


	/* Header Navigation Search Field  */
	.search {
		width: 300px;
		height: 40px;
		padding: 0;
		margin: 0;
		line-height: 40px;
		background-color: var(--mm-white);
		position: relative;
		transition: all .25s linear;
		display: flex;
		align-items: center;
		border-radius: 4px;
		margin-right: 10px;
	}

	.search input {
		width: 100%;
		line-height: 1em;
		padding: 0 0 0 .5em;
		border: none;
		outline: none;
		background-color: transparent;
		color: var(--mm-default-font-color);
		transition: all .25s linear;
	}

	.search span {
		width: 90px;
		height: 40px;
		line-height: 2em;
		padding: 0;
		color: var(--mm-white);
		text-decoration: none;
		display: flex;
		align-items: center;
		justify-content: center;	
		position: absolute;
		top: 0;
		right: 0;
		transition: all .25s linear;
		background-color: var(--mm-orange);
		border-radius: 0 4px 4px 0;
		cursor: pointer;
	}

	.search span:before {
		content: "Search";
	}

	.search span:hover {
		color: #eee;
	}



/*	==========================================================================	

			ORANGE BLOCK MANAGER DASHBOARD

	========================================================================== */

	.mm-orange-block {
		position: absolute;
		right: 0;
		background-color: var(--mm-orange);
		min-height: 60px;
		height: 100%;
		align-items: center;
		max-width: 300px;
		width: 100%;
		justify-content: flex-start;
		display: flex;
		top: 0;	
		border: 0!important;
	}

	.mm-orange-block a {
		color: var(--mm-white);
	}

	.mm-orange-block a:hover {
		text-decoration: underline;
	}

	.mm-orange-block img {
		padding-left:  20px;
		padding-right: 20px;
	}



/*	==========================================================================	

			BROWSER NOTICE

	========================================================================== */

	.browser_notice {
		background-color: #D2327E;
		color: var(--mm-white);
		font-size: 16px;
		width: 100%;
		position: absolute;
		padding: 20px 0;
		bottom: 0;
		top: 60px;
		height: 20px;
		text-align: center;
		display: none;
	}



/*	==========================================================================	

			HUMAN HUB HEADER

	========================================================================== */

	.header-home__icon {
		border-right: 1px solid var( --mm-powder-blue-state);
		width: 80px;
		max-width: 80px;
		height: 60px;
	}

	.humanhub_header {   
		background-color: var(--mm-white);
        max-height: 70px;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin: 0 !important;
min-height:70px;
	}

	.humanhub_header ul {
		display: flex;
		justify-content: space-between;
		align-items: center;
		/*padding: 0 20px;
        min-height: 60px;
        max-height: 60px;*/
padding: 10px 20px 0;
min-height: 60px;
max-height: 60px;
	}

	.humanhub_header li {
		justify-content: space-around;

	}

	.humanhub_header .mp_humanhub_logo img {
		max-height: 40px;
		max-width: 200px;
		width: 100%;
		height: 100%;
	}

	.humanhub_header li:last-child {
		display: flex;
		align-items: center;
		min-width: 332px;
		justify-content: flex-end !important;
	}

	.humanhub_header li:first-child {
		min-width: 332px;
	}

    .humanhub_header li h2 {
        color: var(--mm-navy-blue);
    }

	.humanhub_header li:last-child img {
		border: 2px solid var(--mm-powder-blue);
		border-radius: 6px;	
		height: 56px;
		width: 56px;
	}

	.humanhub_logo {
		display: inline-block;
		width: 300px;
		outline: none;
	}

	.humanhub_nav_wrapper_landing {
		background-color: var(--mm-navy-blue);
		width: 100%;
    	display: inline-flex;
	}

	.humanhub_nav_wrapper {
		background-color: var(--mm-navy-blue);
		width: 100%;
	}


	/* HUMAN HUB MENU */
	.humanhub_menu {
		display: flex;
		align-items: center;
		width: 100%;
		position: relative;
		/*min-height: 60px;*/
		min-height: 44px!important;
		max-height: 44px;
		justify-content: flex-start;
	}

	.humanhub_menu h1 {
		margin-bottom: 0;
		color: var(--mm-white);
		font-weight: normal;
		margin-left: 30px;
		font-size: 20px;
	}

	.humanhub_menu img {
		height: 24px;
		width: 24px;
		margin-top: 5px;
	}

	.humanhub_menu .mm-navigation-header,
	.humanhub_menu .mm-navigation-header .mm-dropdown-button {
		height: 100%;
		max-height: 44px;	
		min-height: 44px;
		box-shadow: none;		
	}

    .humanhub_menu .mm-navigation-header li:nth-child(1) {
        background-color: var(--mm-scarlet-red);
    }

    .humanhub_menu .mm-navigation-header .humanhub_home {
        border-right: 1px solid #d53f43!important;
    }

    .humanhub_menu .mm-navigation-header .humanhub_home a,
    .humanhub_menu .mm-navigation-header .humanhub_home img {
        width: 24px;
        height: 24px;
    }

	.humanhub_menu .mm-navigation-header li {
		/*border-right: 1px solid var(--mm-midnight-blue)!important;*/
border-right: 1px solid #FFFFFF33 !important;
	}

	.humanhub_menu .mm-navigation-header .mm-dropdown-button {
		min-width: 300px;
	}

	.humanhub_menu .mm-navigation-header .mm-dropdown li {
		border-right: 0!important;
        border-bottom: 1px solid #ccd6e0;
	}

	.humanhub_menu .mm-navigation-header .mm-select-element {
		top: 44px!important;
		min-width: 300px!important;
		-webkit-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
		-moz-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
		box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);        
	}

	.humanhub_menu .mm-navigation-header .mm-select-element, 
	.humanhub_menu .mm-navigation-header .mm-select-element li:last-child,
	.humanhub_menu .mm-navigation-header .mm-select-element li:last-child a,
	.humanhub_menu .mm-navigation-header .mm-select-element li:last-child a:hover {
	  border-radius: 0 0 20px 20px !important;
	}
	
	/* Custom Header Dropdown Width */

/*	.humanhub_menu .mm-navigation-header li:nth-child(4) .mm-dropdown-button, 
	.humanhub_menu .mm-navigation-header li:nth-child(4) .mm-select-element {
		min-width: 290px!important;
	} */

	.humanhub_home {
		color: var(--mm-white);
		padding: 5px 14px;
		display: inline-flex;
		align-items: center;
		/* border-right: 1px solid var(--mm-midnight-blue); */
		position: relative;	
	}

	.humanhub_home img {
		height: 24px;
		width: 24px;
		margin-top: 0
	}

	.mm-navigation-sec-header li {
		max-width: 64px;
		max-height: 44px;
		width: 64px;
		height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
	}


	/* Header Switch Block */
	.humanhub_header .mm-switch-block {
		max-width: 220px;	
	}

	.humanhub_header .mm-switch-button-content {
		width: 220px;
	}

	.humanhub_header .mm-switch-light .mm-switch-button {
		background-color: var(--mm-orange);	
	}

	.humanhub_header .mm-switch-button-content img {
		padding-right: 10px;
		width: 16px!important;
		height: 16px!important;
		border: 0!important;
	}



/*	==========================================================================	

			HUMAN HUB HEADER: PEOPLESOFT NAVIGATION HEADER

	========================================================================== */

    .human_hub_logo a,
    .human_hub_logo img {
        width: 201px;
        height: 40px;
        display: block;
    }


    /* PS HEADER */
	.mm_ps_header {
		background-color: var(--mm-grey);
		min-height: 70px;
		width: 100%;
		background: url("../images/header_background_line.png") repeat-x left bottom var(--mm-grey)!important;
		padding: 0!important;
		margin: 0!important;
	}

    .mm_ps_header .mm_ps_header_container {
        min-height: 60px;
    }

	.mm_ps_header ul ul {
		display: flex;
	}

    .mm_ps_header li li {
        min-width: 55px;
        min-height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 10px;
        margin-bottom: 10px;
        max-height: 24px;
    }

    .mm_ps_header li li a,
    .mm_ps_header li:nth-child(1) li:first-child img{
        max-height: 24px;
    }

   	.mm_ps_header li:nth-child(1) li:first-child {
		border-right: 1px solid #818181;
	}

	.mm_ps_header li:nth-child(2) .mm-row-form .form-container {
		background: #D4D4D4;
		height: 25px;
		border: 1px solid #ACACAC;
		border-radius: 5px;
		min-width: 340px;
	}

    .mm_ps_header__secondary li:last-child img {
		border: 1px solid var(--mm-default-font-color);
		border-radius: 6px;
		height: 40px;
		width: 40px;
	}

    .mm_ps_header__secondary li:last-child a {
		height: 40px;
		width: 40px;    
    }


    /* HUMAN HUB LANDING HEADER */
    .mm_landing_header {
        background: none!important;
        min-height: 60px; 
        background-color: var(--mm-grey)!important;
    }

    .mm_landing_nav {
        background: url(%Image(MP_HEADER_BACKGROUND)) repeat-x left bottom var(--mm-navy-blue)!important; 
        min-height: 54px;    
    }

    .humanhub_menu .mm-navigation-header {
        min-height: 44px;
    }

    .mm_landing_nav .humanhub_menu img {
        height: 24px;
        width: 24px;
        margin-top: 0;
        padding-left: 10px;
    }

    .mm_landing_nav .humanhub_menu .mm-navigation-header li {
        min-height: 44px;
        max-height: 44px;    
    }

    .mm_landing_nav .humanhub_menu .mm-navigation-header li:nth-child(1) {
        min-width: 300px;
        max-width: 300px;
    }

    .mm_landing_nav .humanhub_menu .mm-navigation-header li:nth-child(1) .primary-button {
        background-color: var(--mm-scarlet-red)
    }

    .mm_landing_nav .humanhub_menu .mm-navigation-header li:nth-child(1) a[type=button] {
        display: flex;
        align-items: center;
	    min-width:235px;
    }

    .mm_landing_nav .humanhub_menu .mm-navigation-header li:nth-child(1) .mm-select-element img {
        padding-left: 0;
        padding-right: 15px;
    }

    .mm_landing_nav .mm-navigation-header li:nth-child(n+2):hover .primary-button {
        text-decoration: underline;
        text-decoration-color: var(--mm-scarlet-red);
        background-color: var(--mm-navy-blue)!important;
        text-decoration-thickness: 2px;  
    }




/*	==========================================================================	

			HUMAN HUB HEADER: ORANGE BACKGROUND

	========================================================================== */

	.humanhub_menu .mm-orange-background {
		width: 100%;
		max-width: 240px;
		color: var(--mm-white);
		padding: 0 10px;
	}

	.humanhub_menu .mm-orange-background li {
		align-items: center;
		width: 100%;
		max-width: none!important;
	}

	.humanhub_menu .mm-orange-background li:first-child {
		justify-content: flex-start;
	}

	.humanhub_menu .mm-orange-background li span {
		padding-right: 10px;
	}



/*	==========================================================================	

			USER INFO HEADER

	========================================================================== */

	.mm-user-info {
		background-color: var(--mm-powder-blue);
		padding: 5px 5px 5px 0;
		margin-left: 15px;
		margin-right: 0;
		max-height: 50px;
		width: auto;
		display: flex;
	}

	.mm-user-info img {
		position: absolute;
		top: -25px;
		left: -15px;
		max-width: 100px;
		min-width: 100px;
		height: 100px;
		border-radius: 50%;
		max-height: 100px;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);			
	}

	.mm-user-info ul {
		width: 100%;
		height: 50px;
		display: flex;
		align-items: center;	
	}

	.mm-user-info li {
		width: 30%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		transition: .5s all ease;
	}

	.mm-user-info li:first-child {
		margin-left: 8%;
	}

	.mm-user-info li span {
		min-width: 35%!important;
		color: var(--mm-white)!important;
		max-width: 330px;
		text-align: left;
		display: inline-block;	
	}


	/* User Info */
	.updated-user-info {
		background-color: var(--mm-powder-blue);
		margin-left: 15px;
		margin-right: 0;
		min-height: 60px;
		width: auto;
		height: auto;
		display: flex;
		border-radius: 40px;
	}

	.updated-user-info img {
		position: absolute;
		top: -22px;
		left: -14px;
		max-width: 100px;
		min-width: 100px;
		height: auto;
		border-radius: 50%;
		max-height: 100px;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);			
	}

	.updated-user-info ul {
		width: 100%;
		min-height: 60px;
		height: auto;
		display: inline-flex;
		align-items: center;	
	}

	.updated-user-info li {
		width: auto;
		display: flex;
		align-items: center;
		text-align: center;
		max-width: 30%;
	}

	.updated-user-info li:first-child {
		margin-left: 9%;
	}

	.updated-user-info .user-info-button {
		justify-content: flex-end;
		margin-right: 15px;	
		position: absolute;
		right: 0;	
	}

	.updated-user-info li:nth-last-child(2) {
		right: 275px;
	}

	.updated-user-info li:last-child {
		justify-content: flex-end;
		width: 50%;
		margin-right: 15px;
		position: absolute;
		right: 0;
	}

	.updated-user-info li span {
		color: var(--mm-white);
	}

	.updated-user-info-button button {
		flex-flow: column nowrap;
	}

	.updated-user-info-button span {
		font-size: 10px;
		color: var(--mm-default-font-color)!important;
	}


	/* User Info :: Sub Header  */
	.updated-user-info-sub {
		min-height: 80px;
		background-color: var(--mm-powder-blue);
		margin-left: 15px;
		margin-right: 0;
		min-height: 80px;
		width: auto;
		height: auto;
		display: flex;    
	}

	.updated-user-info-sub img {
		position: absolute;
		top: -35px;
		left: -14px;
		max-width: 150px;
		min-width: 150px;
		height: auto;
		border-radius: 50%;
		max-height: 150px;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);			
	}

	.updated-user-info-sub ul {
		min-height: auto;
		width: 100%;
		height: auto;
		display: inline-flex;
		align-items: center;		
	}

	.updated-user-info-sub li {
		display: flex;
		align-items: center	
	}

	.updated-user-info-sub li span {
		color: var(--mm-white);
	}

	.updated-user-info-sub li:first-child {
		margin-left: 11%;
		max-width: 950px!important;
		width: 100%;
		text-align: left;	
	}

	.updated-user-info-sub li:last-child {
		justify-content: flex-end!important;
		width: 100%;
		right: 0;
		max-width: 370px;
	}

	.updated-user-info-sub .mm-sub-employee img {
		top: -75px;
		left: -15px;
		max-width: 150px;
		min-width: 150px;
		max-height: 150px;
	}

	.updated-user-info-sub .mm-sub-employee ul {
		flex-direction: column;		
	}

	.updated-user-info-sub .mm-sub-manager ul {
		flex-direction: column;
		margin-left: 20%;
	}

	.updated-user-info-sub .mm-sub-employee ul li,
	.updated-user-info-sub .mm-sub-manager ul li {
		width: 100%!important;
		max-width: none;	
		min-height: 30px;
	}

	.updated-user-info-sub .mm-sub-manager ul li {
		margin-left: 0!important;
	}

	.updated-user-info-sub .mm-sub-employee, 
	.updated-user-info-sub .mm-sub-employee ul li:first-child {
		margin-left: 0;
	}

	.updated-user-info-sub .mm-sub-employee ul li:last-child {
		justify-content: normal!important;	
		position: initial;
		margin-right: 0;
	}

	.updated-user-info-sub .mm-sub-manager,
	.updated-user-info-sub .mm-sub-manager ul li:last-child {
		justify-content: normal!important;
		width: auto;
		margin-right: 0!important;
		position: initial!important;
		right: 0!important;
	}

	.updated-user-info-sub .mm-sub-manager img {
		top: -30px;
		left: 0;    
		height: auto;	
		max-width: 60px;
		min-width: 60px;
		max-height: 60px;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);					
	}

	.divider {
		margin-left: 12px; 
		margin-right: 12px;	
	}


	/* User Info Centered*/
	.user-info-centered {
		background-color: var(--mm-powder-blue);
		padding: 5px 5px 5px 0;
		margin-right: 0;
		min-height: 50px;
		width: auto;
		height: auto;
		display: flex;
		border-radius: 40px;
	}

	.user-info-centered h3,
	.user-info-centered img {
		transition: .5s all ease;
	}

	.user-info-centered img {
		max-width: 100px;
		min-width: 100px;
		height: auto;
		border-radius: 50%;
		max-height: 100px;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);	
	}

	.user-info-centered ul {
		width: 100%;
		min-height: 50px;
		height: 50px;
		display: inline-flex;
		align-items: center;
		justify-content: center;	
	}

	.user-info-centered li {
		width: auto;
		display: flex;
		align-items: center;
		text-align: center;
		max-width: 24%;
		justify-content: space-evenly;	
		padding: 0 20px;
		color: var(--mm-white);
	}

	.user-info-centered li:first-child,
	.user-info-centered li:last-child {
		width: 100%;
	}



/*	==========================================================================	

			CUSTOM FORM // DROPDOWN ARROW 

	========================================================================== */

	.mm-select-element {
		-moz-appearance: none;
		-webkit-appearance: none;
		appearance: none;

		/* Your style */
		outline: none !important;
		color: var(--mm-default-font-color);
		height: auto;
		border-radius: 0 !important;
		display: none;
		position: absolute;
		margin-top: -1px;
		border: 1px solid var(--mm-silver-grey);
		min-width: 160px;
		z-index: 10;
	}


	/* Default Selector */
	.mm-selector {
		position:relative;
		display: inline-block;
		margin: 0!important;	
	}

	.mm-selector::before {
		position: absolute;
		right: 10px;
		top: 0;
		bottom: 0;
		margin-top: auto;
		margin-bottom: auto;
		margin-left: auto;
		content: "";
		z-index: 5;
		width: 0;
		height: 0;
		border-top: 13px solid #727272;
		border-left: 8px solid transparent;
		border-bottom: 0px solid transparent;
		pointer-events: none;
		border-right: 8px solid transparent; 
	}
			
	.mm-selector.active::before {
		border-top: 13px solid var(--mm-white)!important;
	}

	.mm-selector .mm-dropdown-button:hover {
		background-color: var(--mm-silver-grey);
		color: var(--mm-white);
		border: 2px solid var(--mm-silver-grey);
	}

	.mm-selector .mm-dropdown-content {
		display: none;
		position: absolute;
		background-color: var(--mm-white);
		min-width: 160px;
		z-index: 10;
		height: auto !important;
		border: 1px solid var(--mm-silver-grey) !important;
		margin-top: -1px;
	}

	.mm-selector .mm-dropdown-content li {
		border-bottom: 1px solid var(--mm-silver-grey);
		max-width: 100%;
		width: 298px; 
		margin: 0;
		padding: 0;
		text-align: left;		
	}

	.mm-selector .mm-dropdown-content a {
		color: var(--mm-default-font-color);	 
		padding: 12px 16px;
		text-decoration: none;
		display: block;
		margin: -1px;
	}

	.mm-selector .mm-dropdown-content a:hover {
		background-color: var(--mm-silver-grey);
		color: var(--mm-white);
		margin: -1px;
	}

	
	/* Selector Alt */
	.mm-selector-alt {
		position:relative;
		display: inline-block;
	}

	.mm-selector-alt::before {
		position: absolute;
		right: 10px;
		top: 0;
		bottom: 0;
		margin-top: auto;
		margin-bottom: auto;
		margin-left: auto;
		content: "";
		z-index: 1;
		width: 0;
		height: 0;
		border-top: 13px solid var(--mm-powder-blue);
		border-left: 8px solid transparent;
		border-bottom: 0px solid transparent;
		pointer-events: none;
		border-right: 8px solid transparent; 
	}

	.mm-selector-alt.active::before {
		border-top: 13px solid var(--mm-white)!important;
	}

	
	/* Selector White */
	.mm-selector-white {
		position:relative;
		display: inline-block;
	}

	.mm-selector-white::before {
		position: absolute;
		right: 10px;
		top: 0;
		bottom: 0;
		margin-top: auto;
		margin-bottom: auto;
		margin-left: auto;
		content: "";
		z-index: 1;
		width: 0;
		height: 0;
		border-top: 13px solid var(--mm-white);
		border-left: 8px solid transparent;
		border-bottom: 0px solid transparent;
		pointer-events: none;
		border-right: 8px solid transparent; 
	}

	.mm-selector-white.active::before {
		border-top: 13px solid var(--mm-white)!important;
	}



/*	========================================= 

				DYNAMIC DROPDOWN
		
   	========================================= */

	.mm-dynamic-dropdown {
		min-height: 60px;
	}

	.mm-dynamic-dropdown ul li .button {
		min-width: 240px;
		height: 40px!important;
		display: block!important;	
	}

	.mm-dynamic-dropdown img {
		top: -5px;
		left: -40px;
		max-width: 80px;
		min-width: 80px;
		max-height: 80px!important;
	}

	.mm-dynamic-dropdown ul {
		flex-direction: column;
		align-items: flex-end!important;
	    background-color: transparent;
		justify-content: center;
	}

	.mm-dynamic-dropdown ul li:first-child {
		max-width: 260px!important;
		margin-left: 0!important;
		padding: 0;
	}

	.mm-dynamic-dropdown .down-arrow .mm-navigation-header .mm-select-element {
		right: auto!important;
		left: 0!important;
		min-width: 240px!important;
		top: 40px;     
		border-radius: 0 0 20px 20px!important;	
	}

	.mm-dynamic-dropdown .mm-navigation-header {
		background-color: transparent;
	}	

	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element li:first-child a {
		color: var(--mm-navy-blue);
	}

	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element li {
		position: relative;
		padding: 0;
	}

	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element li img {
		top: 10px!important;
		left: auto!important;
		max-width: none!important;
		min-width: auto!important;
		max-height: none!important;
		right: 0!important;
		display: flex!important;
		position: absolute!important;
		right: 20px!important;
	}

	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element {
		max-width: 200px;
	    background-color: var(--mm-powder-blue);
	}

	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element a {
		/*border-bottom: 1px solid #008598;*/
border-bottom: 1px solid var(--mm-grey);
		min-height: 40px!important;
color: var(--mm-powder-blue);
	}

	.mm-dynamic-dropdown .mm-navigation-header .mm-dropdown-button:hover,
	.mm-dynamic-dropdown .mm-navigation-header .active .mm-dropdown-button {
		border-radius: 20px 20px 0 0;
background-color: var(--mm-powder-blue-state)!important;
color: var(--mm-white) !important;
	}

.mm-dynamic-dropdown .mm-navigation-header .mm-dropdown-button {
    background-color: var(--mm-white)!important; 
    color: var(--mm-powder-blue) !important;  
}

	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element li:last-child,
	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element li:last-child a,
	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element li:last-child a:hover {
		border-radius: 0 0 20px 20px!important;
		border-bottom: none;
	}

	.mm-dynamic-dropdown .mm-navigation-header .mm-select-element {
		 display: none;
	}

	.mm-dynamic-dropdown .mm-dropdown:hover .mm-select-element {
		display: block;
		height: auto;
	}



/*	========================================= 

				DYNAMIC SELECT
		
   	========================================= */

	.mm-dynamic-select {
		min-height: 40px;
		position: relative;
	}

	.mm-dynamic-select ul li .button {
		min-width: 300px;
		height: 40px!important;
		display: block!important;	
	}

	.mm-dynamic-select img {
		top: -5px;
		left: -40px;
		max-width: 80px;
		min-width: 80px;
		max-height: 80px!important;
	}

	.mm-dynamic-select ul {
		flex-direction: column;
		align-items: flex-end!important;
		background-color: transparent;
		justify-content: center;
	}

	.mm-dynamic-select ul li:first-child {
		max-width: 300px!important;
		margin-left: 0!important;
		padding: 0;
		width: 100%;
	}

	.mm-dynamic-select .down-arrow .mm-navigation-header .mm-select-element {
		right: auto!important;
		left: 0!important;
		min-width: 300px!important;
		top: 40px;     
		border-radius: 0 0 20px 20px!important;	
		background-color: var(--mm-grey);
		-webkit-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
		-moz-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
		box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);		
	}

	.mm-dynamic-select .mm-navigation-header {
		min-height: 40px;
	}	

	.mm-dynamic-select .mm-navigation-header .mm-select-element li {
		position: relative;
		padding: 0;
		display: block;
		margin-bottom: 0;
	}

	.mm-dynamic-select .mm-navigation-header .mm-select-element li img {
		top: 12px!important;
		left: 10px!important;
		max-width: none!important;
		min-width: auto!important;
		max-height: none!important;
		right: 0!important;
		display: flex!important;
		position: absolute!important;
		right: 20px!important;
	}

	.mm-dynamic-select .mm-navigation-header .mm-select-element {
		max-width: 300px;
		background-color: var(--mm-white);
	}

	.mm-dynamic-select .mm-navigation-header .mm-select-element a {
		border-bottom: 1px solid var(--mm-steel-grey);
		min-height: 40px!important;
		width: auto;
		padding-left: 40px;
		color: var(--mm-default-font-color);		
	}

	.mm-dynamic-select .mm-navigation-header .mm-select-element a:hover {
		background-color: var(--mm-light-blue);
		color: var(--mm-default-font-color);
		margin: 0;
		-webkit-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
		-moz-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
		box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
text-decoration: none !important;
	}

	.mm-dynamic-select .mm-navigation-header .mm-dropdown-button {
		background-color: var(--mm-white);		
		padding: 0 15px 0 15px;
		height: 40px;
		max-height: 40px;
		border-radius: 4px;
		min-width: 300px;
		width: 100%;
		color: var(--mm-default-font-color);
	}

	.mm-dynamic-select .mm-navigation-header .mm-dropdown-button:hover,
	.mm-dynamic-select .mm-navigation-header .active .mm-dropdown-button {
		background-color: var(--mm-white)!important;
		color: var(--mm-default-font-color);
		border-radius: 4px 4px 0px 0;	
	}

	.mm-dynamic-select .mm-navigation-header .mm-select-element li:last-child,
	.mm-dynamic-select .mm-navigation-header .mm-select-element li:last-child a,
	.mm-dynamic-select .mm-navigation-header .mm-select-element li:last-child a:hover 
{
		border-radius: 0 0 20px 20px!important;
		border-bottom: none;
	}

	.mm-dynamic-select .mm-navigation-header .mm-selector-white::before {
		border-top: 13px solid var( --mm-powder-blue-state)!important;
	}

	.mm-dynamic-select .mm-navigation-header .mm-select-element {
		 display: none;
	}

	.mm-dynamic-select .mm-dropdown:hover .mm-select-element {
		display: block;
		height: auto;
	}


    /* Dynamic Basic Select */
    .mm-dynamic-basic-select {
        padding: 0!important;
        min-width: 300px !important;
        max-width: 300px !important;    
    }

    .mm-dynamic-basic-select .mm-navigation-header {
        padding: 0!important;
    }

    .mm-dynamic-basic-select .down-arrow .mm-navigation-header .mm-select-element {
        background-color: var(--mm-white)!important;
        border-left: 1px solid var(--mm-steel-grey) !important;
        border-right: 1px solid var(--mm-steel-grey) !important;
        border-bottom: 1px solid var(--mm-steel-grey) !important; 
        padding: 0;
    }

    .mm-dynamic-basic-select .mm-navigation-header .mm-select-element li {
        display: block !important;
        margin-top: 0 !important;
        width: 100%;
    }

    .mm-dynamic-basic-select .mm-navigation-header .mm-select-element a {
        padding-left: 15px!important;
        border-top: 1px solid var(--mm-steel-grey);
        border-bottom: 0!important;
    }

    .mm-dynamic-basic-select ul li:first-child {
        margin: 0!important;
    }



/*	========================================= 

		FORM INPUTS
		
   	========================================= */

	.mm-row-form {
		display: flex;
	}

	.mm-row-form form {
		width: 100%;
		display: inline-flex
	}

	.mm-row-form .form-container {
		display: inline-flex;
		align-items: stretch;
		width: 100%;
		border-radius: 4px;
		height: auto;
		padding: 5px 10px;
		background: var(--mm-white);
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
 	   	-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
    	box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);		
	}

	.mm-row-form label {
		width: 100%;
		align-items: center;
		display: flex;
		max-width: 175px;
	}

	.mm-row-form input {
		width: 100%;
		display: flex;
		justify-content: flex-start;
		line-height: 1.65;
		border: 0;
		background: transparent;
		font-size: 16px;
	}

	.mm-row-form span {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		padding: 0!important;
		float: none;
	}

	.mm-row-form-icon .form-field-icon {
		max-width: 21px;
		height: 20px;
	}



/*	========================================= 

		FORM SELECT
		
   	========================================= */

	.mm-select {
		position: relative;
		display: inline-flex;
		align-items: stretch;
		width: 100%;
	}

	.mm-select select {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		display: flex;
		width: 100%;
		margin: 0;
		padding: 0 30px 0 10px;
		font-size: 16px;
		line-height: 1.65;
		color: var(--mm-default-font-color);
		background-color: var(--mm-white);
		background-image: none;
		border: 0;
		border-radius: 4px;
		-ms-word-break: normal;
		word-break: normal;
		cursor: pointer;
		font-family: var(--mm-font-stack);
	}

	option:selection, option:hover{
	  background-color: #D9F2F5;
	  color: var(--mm-default-font-color);
	}

	.mm-select:after {
		content: '';
		color: var(--mm-darker-grey);
		right: 10px;
		top: 8px;
		position: absolute;
		pointer-events: none;
		width: 0;
		height: 0;
		border-top: 13px solid var(--mm-powder-blue);
		border-left: 8px solid transparent;
		border-bottom: 0px solid transparent;
		border-right: 8px solid transparent;
	}



/*	========================================= 

		FORM TEXTAREA
		
   	========================================= */

	.mm-textarea {
		position: relative;
		width: 100%;
	}

	.mm-textarea textarea {
		display: block;
		width: 100%;
		min-height: 60px;
		margin: 0;
		font-size: 16px;
		line-height: 1.3;
		color: var(--mm-default-font-color);
		background-color: var(--mm-white);
		background-image: none;
		border: 0;
		border-radius: 4px;
		font-family: var(--mm-font-stack);
	}



/*	========================================= 

		FILE UPLOAD
		
   	========================================= */

	/* Default Upload Button */
    .mm-upload-button-wrapper {
        position: relative;
        overflow: hidden;
        display: inline-block;
        border-radius: 50px;
		-webkit-box-shadow: -4px 3px 6px 0px rgba(65,65,65,0.4);
		-moz-box-shadow: -4px 3px 6px 0px rgba(65,65,65,0.4);
		box-shadow: -4px 3px 6px 0px rgba(65,65,65,0.4);        
	}

	.mm-upload-button-wrapper .button-icon {
        left: 45px;
	}

	.mm-upload-button-wrapper input[type=file] {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        height: 40px;
        cursor: pointer;
	}
	

	/* Alternate Document Upload */
	.mm-alt-upload-button-wrapper input[type=file] {
		max-width: 200px;
	}

	.mm-alt-upload-button-wrapper .mm-attach-document {
		min-width: 200px; 
		border-radius: 50px 0 0 50px!important; 
		justify-content: space-around; 
		align-items: center; 
		display: flex; 
		min-height: 38px; 
        /* border: 1px solid rgb(65, 65, 65, .3)!important; */
		background-color: var(--mm-white); 
		opacity: .8; 
		padding-left: 5px;	
	}

	.mm-alt-upload-button-wrapper .mm-upload-button {
		min-width: 100px; 
		border-radius: 0 50px 50px 0!important; 
		min-height: 40px; 
		align-items: center; 
		justify-content: center; 
		display: flex;	
	}



/*	========================================= 

		INPUT RADIO / CHECKBOX BUTTONS
		
   	========================================= */

	/* CUSTOM RADIO STYLING */
	/* The container */
	.mm-input-label,
	.mm-input-label-alt {
		display: table;
		position: relative;
		padding-left: 30px;
		cursor: pointer;
		font-size: 16px;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		line-height: 35px;
		width: auto;
	}

	/* Hide the browser's default checkbox */
	.mm-input-label input,
	.mm-input-label-alt input {
		position: absolute;
		opacity: 0;
		cursor: pointer;
		height: 0;
		width: 0;
		font-family: var(--mm-font-stack);
	}



/*	========================================= 

		INPUT RADIO BUTTONS
		
   	========================================= */

	/* CUSTOM RADIO BUTTON */
	.mm-input-label .radiomark {
		position: absolute;
		top: 8px;
		left: 0;
		height: 20px;
		width: 20px;
		background-color: var(--mm-white);
		border-radius: 50%;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);		
	}

	/* On mouse-over, add a grey background color */
	.mm-input-label:hover input ~ .radiomark {
		background-color: var( --mm-powder-blue-state);
	}

	/* When the checkbox is checked, add a blue background */
	.mm-input-label input:checked ~ .radiomark {
		background-color: var(--mm-powder-blue);
	}

	/* Create the checkmark/indicator (hidden when not checked) */
	.mm-input-label .radiomark:after {
		content: "";
		position: absolute;
		display: none;
	}

	/* Show the checkmark when checked */
	.mm-input-label input:checked ~ .radiomark:after {
		display: block;
	}

	/* Style the checkmark/indicator */
	.mm-input-label .radiomark:after {
		top: 5px;
		left: 5px;
		width: 10px;
		height: 10px;
		border-radius: 50%;
		background: var(--mm-white);
	}



/*	========================================= 

		INPUT CHECKBOX
		
   	========================================= */

	/* CUSTOM CHECKBOX */
	.mm-input-checkbox-label,
	.mm-input-checkbox-label-alt{
		line-height: 20px!important;
		margin-bottom: 20px!important;
	}

	.mm-input-label .checkmark {
		position: absolute;
		top: 0;
		left: 0;
		height: 20px;
		width: 20px;
		background-color: var(--mm-white);
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);		
	}

	/* On mouse-over, add a grey background color */
	.mm-input-label:hover input ~ .checkmark {
		background-color: var( --mm-powder-blue-state);
	}

	/* When the checkbox is checked, add a blue background */
	.mm-input-label input:checked ~ .checkmark {
		background-color: var(--mm-powder-blue);
	}

	/* Create the checkmark/indicator (hidden when not checked) */
	.mm-input-label .checkmark:after,
	.mm-input-label-alt .checkmark:after{
		content: "";
		position: absolute;
		display: none;
	}

	/* Show the checkmark when checked */
	.mm-input-label input:checked ~ .checkmark:after,
	.mm-input-label-alt input:checked ~ .checkmark:after{
		display: block;
	}
	
	/* Style the checkmark/indicator */
	.mm-input-label .checkmark:after,
	.mm-input-label-alt .checkmark:after{
		left: 8px;
		top: 3px;
		width: 3px;
		height: 8px;
		border: solid white;
		border-width: 0 3px 3px 0;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}


	/* CUSTOM CHECKBOX ALT */
	.mm-input-label-alt .checkmark {
		position: absolute;
		top: 0;
		left: 0;
		height: 20px;
		width: 20px;
		background-color: var(--mm-white);
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);		
	}

	/* On mouse-over, add a grey background color */
	.mm-input-label-alt:hover input ~ .checkmark {
		background-color: #e5e5e5;
	}

	/* When the checkbox is checked, add a blue background */
	.mm-input-label-alt input:checked ~ .checkmark {
		background-color: var(--mm-white);
	}
	
	/* Style the checkmark/indicator */
	.mm-input-label-alt .checkmark:after {
		left: 8px;
		top: 3px;
		width: 3px;
		height: 8px;
		border: solid var(--mm-powder-blue);
		border-width: 0 3px 3px 0;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}



/*	========================================= 

		SWITCHES // SLIDERS
		
   	========================================= */

    .mm-form-filters {
        padding: 20px;
    }

    .mm-form-filters__header {
        display: flex;
        align-content: center;
        flex-wrap: wrap;
    }

    .mm-form-filters__header h3 {
        display: flex;
        align-items: center;
    }

    .mm-form-filters__header h3 img {
        width: 20px;
        height: 20px;
        margin-right: 10px;
    }

    .mm-form-filters .mm-search-form {
        display: flex;
        margin-bottom: 20px;
    }

    .mm-form-filters .mm-search-form li {
        width: 100%;
        margin-right: 80px;
    }

    .mm-form-filters .mm-search-form li:last-child {
        margin-right: 0;
        display: flex;
        justify-content: end;    
    }

    .mm-form-filters .mm-search-form li:last-child .mm-row-form form {
        justify-content: space-between;
        width: 540px;
    }

    .mm-form-filters .mm-search-form li label {
        min-width: 230px;
        max-width: 230px;
        width: 100%;	
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        margin-right: 10px;
    }

    .mm-form-filters .mm-search-form li label span {
        font-size: 12px;
        font-weight: normal;
    }

    .mm-form-filters .mm-search-form li .form-container {
        min-width: 280px;
        max-width: 280px;
        width: 100%;	
    }

    .mm-form-filters-button-container .button-clear {
        min-width: 100px;
        margin-right: 20px;
    }




/*	========================================= 

		SWITCHES // SLIDERS
		
   	========================================= */

	/* Slider */
	.mm-slider {
		position: relative;
	    min-height: 38px;
	}

	.mm-slider input[type="checkbox"].checkbox-toggle {
		position: absolute;
		left: -9999px;
		visibility: hidden;
	}

	.mm-slider input.checkbox-toggle:checked + label.checkbox-toggle-label::before {
		background: var(--mm-grey);
		/* border: 1px solid #D3D3D3; */
	}

	.mm-slider label.checkbox-toggle-label::before {
		content: '';
		background: var(--mm-grey);
		/* border: 1px solid #D3D3D3; */
		-webkit-box-shadow: 0px 2px 8px -2px rgba(65,65,65,0.4);
    	-moz-box-shadow: 0px 2px 8px -2px rgba(65,65,65,0.4);
    	box-shadow: 0px 2px 8px -2px rgba(65,65,65,0.4);		
		width: 68px;
		height: 36px;
		position: absolute;
		top: 0;
		/*right: 30px;*/
		left: 0;
		border-radius: 25px;
	}

	.mm-slider input.checkbox-toggle:checked + label.checkbox-toggle-label::after {
		opacity: 1;
		transform: translateX(32px);
		background: var(--mm-green);
	}

	.mm-slider label.checkbox-toggle-label::after {
		content: '';
		position: absolute;
		/*right: 68px;*/
		left: 5px;
		top: 5px;
		width: 28px;
		height: 28px;
		background: var(--mm-red);
		transition: .1s ease-in;
		border-radius: 50%;
		cursor: pointer;
	}


	/* Light Switch */
	.mm-switch-block {
		width: 100%;
		display: inline-flex;
		max-width: 200px;
		font-family: var(--mm-font-stack);
		font-size: 14px;	
	}

	.mm-switch-light {
		position: relative;
		display: block;
	}	

	.mm-switch-light input {
		position: absolute;
		opacity: 0;
		z-index: 3;
	}
	
	.mm-switch-light .mm-switch-button-content {
		position: relative;
		overflow: hidden;
		min-height: 2em;
		padding: 0;
		text-align: left;
		background-color: var(--mm-grey);	
		border-radius: 50px;	
	}

	.mm-switch-light .mm-switch-button-content span {
		position: relative;
		z-index: 2;
		float: left;
		width: 50%;
		height: 32px;
		border: 0!important;
		cursor: pointer;
		display: inline-flex;	
		justify-content: center;	
		align-items: center;		
	}

	.mm-switch-light .mm-switch-button-content span, 
	.mm-switch-light input:checked ~ .mm-switch-button-content span:first-child {
		color: #8d8d8d;
		text-align: center;
	    filter: brightness(65%);
	}	

	.mm-switch-light input ~ .mm-switch-button-content span:first-child, 
	.mm-switch-light input:checked ~ .mm-switch-button-content span:nth-child(2), 
	.mm-switch-light input:checked + label {
		color: var(--mm-white);
		filter: brightness(100%);
	}

	.mm-switch-light .mm-switch-button {
		position: absolute;
		right: 49%;
		top: 0;
		z-index: 1;
		width: 49%;
		display: block;
		transition: all 0.2s ease-out;
		background-color: var(--mm-green);	
		border-radius: 50px;
		height: 32px;
		margin: 4px 0px;
	}

	.mm-switch-light input:checked ~ .mm-switch-button-content .mm-switch-button {
		right: 2%;
	}

	.mm-switch-button-content {
		height: 40px;
		width: 200px;
		display: inline-flex;	
		justify-content: center;	
		align-items: center;
	}
	
	.mm-switch-button-content img {
		padding-right: 10px;	
	}


    /* 3 Phase Toggle Switch */
    .switch-toggle {
        background: var(--mm-lighter-grey);
        display: inline-block;
        width: 100px;
        height: 30px;
        border-radius: 20px;	
        position: relative;
        padding: 5px;
    }

    .switch-toggle input {
        opacity: 0;
        height: 30px;
        width: 30px;
        position: absolute;
        border-radius: 15px;
        cursor: pointer;
    }

    .switch-toggle input + label {
        color: transparent;
        height: 30px;
        width: 30px;
        font-size: 12px;
        cursor: pointer;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        transition: 100ms all ease;
        vertical-align: middle;
        font-family: var(--mm-font-stack);
        font-size: 16px;	
    }

    .switch-toggle input[value="na"]:checked + label {
        background: var(--mm-powder-blue);
    }

    .switch-toggle input[value="on"]:checked + label {
        background: var(--mm-red);
        color: var(--mm-default-font-color);
    }

    .switch-toggle input[value="on"]:checked + label span {
        position: absolute;
        right: 25px;
    }

    .switch-toggle input[value="off"]:checked + label {
        background: var(--mm-green);
        color: var(--mm-default-font-color);
    }

    .switch-toggle input[value="off"]:checked + label span {
        position: absolute;
        left: 25px;
    }



/*	========================================= 

        DYNAMIC SWITCH TOGGLE 2-PHASE
		
   	========================================= */

    .dynamic-switch-toggle-2-phase {
        background: var(--mm-lighter-grey);
        display: inline-block;
        width: 100px;
        min-width: 100px;
        height: 30px;
        border-radius: 20px;	
        position: relative;
        padding: 5px;
        -webkit-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        -moz-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);    
    }

    .dynamic-switch-toggle-2-phase input {
        opacity: 0;
        height: 30px;
        width: 30px;
        position: absolute;
        border-radius: 15px;
        cursor: pointer;
        z-index: 1;
    }

    .dynamic-switch-toggle-2-phase input + label {
        color: transparent;
        height: 30px;
        width: 30px!important;
        font-size: 12px;
        cursor: pointer;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        transition: 100ms all ease;
        vertical-align: middle;
        font-family: var(--mm-font-stack);
        font-size: 16px!important;
        min-width: 30px!important;
        max-width: 30px!important;
    }

    .dynamic-switch-toggle-2-phase input + label span {
        font-size: 16px!important;
    }

    .dynamic-switch-toggle-2-phase input[value="na"]:checked + label {
        background: var(--mm-powder-blue);
    }

    .dynamic-switch-toggle-2-phase input[value="on"]:checked + label {
        background: var(--mm-red);
        color: var(--mm-default-font-color);
    }

    .dynamic-switch-toggle-2-phase input[value="on"]:checked + label span {
        position: absolute;
        right: 25px;
    }

    .dynamic-switch-toggle-2-phase input[value="off"]:checked + label {
        background: var(--mm-green);
        color: var(--mm-default-font-color);
        right: 5px;
        position: absolute;
    }

    .dynamic-switch-toggle-2-phase input[value="off"]:checked + label span {
        position: absolute;
        left: -55px;
    }



/*	========================================= 

        DYNAMIC SWITCH TOGGLE 3-PHASE
		
   	========================================= */
    
    .dynamic-switch-toggle-3-phase {
        background: var(--mm-lighter-grey);
        display: inline-block;
        width: 100px;
        height: 30px;
        border-radius: 20px;	
        position: relative;
        padding: 5px;
        -webkit-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        -moz-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);    
    }

    .dynamic-switch-toggle-3-phase input {
        opacity: 0;
        height: 30px;
        width: 30px;
        position: absolute;
        border-radius: 15px;
        cursor: pointer;
    }

    .dynamic-switch-toggle-3-phase input + label {
        color: transparent;
        height: 30px;
        width: 30px;
        font-size: 12px;
        cursor: pointer;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        transition: 100ms all ease;
        vertical-align: middle;
        font-family: var(--mm-font-stack);
        font-size: 16px;	
    }

    .dynamic-switch-toggle-3-phase input[value="na"]:checked + label {
        background: var(--mm-powder-blue);
    }

    .dynamic-switch-toggle-3-phase input[value="on"]:checked + label {
        background: var(--mm-red);
        color: var(--mm-default-font-color);
    }

    .dynamic-switch-toggle-3-phase input[value="on"]:checked + label span {
        position: absolute;
        right: 25px;
    }

    .dynamic-switch-toggle-3-phase input[value="off"]:checked + label {
        background: var(--mm-green);
        color: var(--mm-default-font-color);
    }

    .dynamic-switch-toggle-3-phase input[value="off"]:checked + label span {
        position: absolute;
        left: 25px;
    }



/*	=========================================

            GREEN COLLAPSIBLE SLIDER

   	========================================= */

    .mm-green-collapsible-slider {
        position: relative; 
        background-color: var(--mm-green); 
        border-radius: 10px; 
        padding: 2px;
    }

    .mm-green-collapsible-slider h3 {
        max-width: 1000px;
        width: 100%;
        align-items: center;
    }

    .mm-green-collapsible-slider h3 span {
        min-width: 60px;
        height: 60px;
        background-color: #00AB95;
        border: 3px solid var(--mm-white);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 20px;
        font-size: 28px;
    }



/*	=========================================

        COLLAPSIBLE SLIDER CONTENT SLIDER

   	========================================= */
    
    .mm-collapsible-slider-content .mm-slider {
        right: 110px;
    }

    .mm-collapsible-slider-content .mm-slider label.checkbox-toggle-label::before {
        width: 100px!important;
        height: 40px!important;
    }

    .mm-collapsible-slider-content .mm-slider input.checkbox-toggle:checked + label.checkbox-toggle-label::before {
        background-color: var(--mm-lighter-grey)!important;
        padding-left: 20px;
    }

    .mm-collapsible-slider-content .mm-slider label.checkbox-toggle-label::before {
        background-color: var(--mm-lighter-grey)!important;
        padding-right: 20px;
    }

    .mm-collapsible-slider-content .mm-slider label.checkbox-toggle-label::after {
        width: 30px!important;
        height: 30px!important;
    }

    .mm-collapsible-slider-content .mm-slider input.checkbox-toggle:checked + label.checkbox-toggle-label::after {
        left: 43px!important;
        top: 6px!important;    
    }

    .mm-collapsible-slider-content .mm-slider input.checkbox-toggle:checked + label.checkbox-toggle-label::before {
        background: var(--mm-grey);
        content: "Yes";
        display: flex;
        justify-content: flex-start;
        align-items: center;
        padding-left: 10px;
        padding-right: 0;
    } 

    .mm-collapsible-slider-content .mm-slider label.checkbox-toggle-label::before {
        content: "No";
        background: var(--mm-grey);
        -webkit-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        -moz-box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        box-shadow: 0px 3px 6px 0px rgba(65,65,65,0.4);
        width: 58px;
        height: 36px;
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 25px;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding-right: 10px;
    }



/*	=========================================

        COLLAPSIBLE SLIDER CONTENT BLOCK

   	========================================= */
    
    .mm-disabled .mm-collapsible-slider-content-block {
        border-radius: 0;
        background-color: var(--mm-grey);
        filter: none!important;
    }

    .mm-collapsible-slider-content-block {
        background-color: var(--mm-white);
        border-radius: 0 0 8px 8px;
        height: auto;
    }

    .mm-collapsible-slider-content-block .form_layout li {
        display: inline-block;
    }

    .mm-collapsible-slider-content-block .form_layout li:first-child {
        margin-right: 50px;
    }

    .mm-collapsible-slider-content-block .form_layout li:last-child {
        margin-left: 50px;
    }

    .mm-collapsible-slider-content-block .form_layout label {
        max-width: 280px;
        width: 100%;
        display: inline-block;
        font-weight: 500;
    }

    .mm-collapsible-slider-content-block .form_layout .mm-row-form {
        max-width: 240px;
        display: inline-flex;
        width: 100%;
    }

    .mm-collapsible-slider-content-block .form_layout_wide .mm-row-textarea,
    .mm-collapsible-slider-content .form_layout_wide .mm-row-textarea {
        max-width: 870px;
    }



/*	=========================================

        GREEN COLLAPSIBLE SLIDER HEADER

   	========================================= */
    
    .mm-green-bordered-slider-header {
        position: relative; 
        background-color: var(--mm-white); 
        border-radius: 10px; 
        padding: 2px;
        border: 2px solid #38B478;
    }

    .mm-green-bordered-slider-header h3 {
        align-items: center;
    }

    .mm-green-bordered-slider-header h3 img{
        margin-right: 20px;
    }

    .mm-bordered-slider-content {
        border-radius: 0 0 8px 8px;
        height: auto;
    }



/*	=========================================

            CONTENT DISPLAY LISTS GREEN

   	========================================= */
    
    .content_display_lists__block_green {
        max-width: 1560px; 
        border: 2px solid var(--mm-green); 
        border-radius: 10px; 
        width: 100%; 
        min-height: auto; 
        height: auto; 
        display: inline-block; 
        padding-bottom: 0;
        background-color: var(--mm-white);	
    }

    .content_display_lists__header_green {
        background-color: var(--mm-green);
        min-height: 60px;
        color: var(--mm-white);
        font-size: 16px;
        text-align: left;
        padding: 10px 0;
        border-radius: 6px 6px 0 0;
        height: auto;
    }

    .content_display_lists__header_green ul {
        height: 60px;
    }

    .mm-collapsible-slider-content {
        padding: 0 20px;
        background-color: var(--mm-white);
        border-radius: 0 0 8px 8px;
        height: auto;
    }



/*	========================================= 

		HORIZONTAL LISTS // GRIDS
		
   	========================================= */

	/* Horizontal Grid Header */
	.mm-grid-header {
		background-color: var(--mm-light-blue);
		border-radius: 4px 4px 0 0;	
	}

	.mm-grid-footer {	
		background-color: var(--mm-light-blue);
		border-radius: 0 0 4px 4px;
	}

	.mm-grid-header flex-item {
		font-weight: 500;
		min-height: 40px;
		padding-top: 5px;
		padding-bottom: 5px;		
	}

	.mm-horizontal-lists flex-container {
		display: flex;
		justify-content: space-evenly;	
		margin-bottom: 40px;
	}

	.mm-horizontal-lists flex-item {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 10px;
    	border-radius: 4px;
		height: auto;
		min-height: 40px;
	}

	.mm-horizontal-lists flex-item button,
	.mm-horizontal-lists flex-item .button{
		min-width: 175px;
	}

	.mm-one-horizontal-lists flex-item {
		width: 100%;	
	}

	.mm-two-horizontal-lists flex-item {
		width: calc(50% - 35px);	
	}

	.mm-three-horizontal-lists flex-item {
		width: calc(33% - 35px);	
	}

	.mm-four-horizontal-lists flex-item {
		width: calc(25% - 35px);	
	}

	.mm-five-horizontal-lists flex-item {
		width: calc(20% - 35px);	
	}

	.mm-six-horizontal-lists flex-item {
		width: calc(16.6% - 35px);		
	}

	.mm-seven-horizontal-lists flex-item {
		width: calc(14.2% - 35px);		
	}

	.mm-eight-horizontal-lists flex-item {
		width: calc(12.5% - 35px);		
	}

	.mm-nine-horizontal-lists flex-item {
		width: calc(11.1% - 35px);		
	}



/*	========================================= 

		HORIZONTAL SCROLLING GRIDS
		
   	========================================= */

	.grid-column-height {
		height: auto!important;
		background-color: var(--mm-white);
	}

	.grid-column-one {
		width: 100%;
		min-width: 220px;
		background-color: var(--mm-white);	
	}

	.grid-column-one .mm-grid-header {
		border-radius: 0;
	}

	.grid-column-one li:first-child {
		border-right: 0;
	}

	.grid-column-one li {	
		border-right: 1px solid var(--mm-grey);
	}

	.grid-column-content {
		width: 100%;
		min-width: 2800px;
		background-color: var(--mm-white);
	}

	.grid-column-content .mm-grid-header {
		border-radius: 0;
	}

	.grid-column-one li,
	.grid-column-content li {
		border-bottom: 1px solid var(--mm-grey);
	}

	.grid-column-one .mm-grid-header,
	.grid-column-content .mm-grid-header,
	.grid-column-one .mm-grid-header flex-item,
	.grid-column-content .mm-grid-header flex-item {
		max-height: 50px;
		min-height: 50px;
		font-size: 14px;
		padding: 0 10px!important;
	}

	.grid-column-one flex-container,
	.grid-column-content flex-container {
		min-height: 100px;
		font-size: 14px;
	}

	.grid-column-one flex-container,
	.grid-column-one flex-item,
	.grid-column-content flex-item {
		justify-content: flex-start;
	}

	.grid-column-content flex-item:nth-child(1) {
		width: 100%;
		max-width: 80px;
		min-width: 80px;
	}

	.grid-column-content flex-item:nth-child(2),
	.grid-column-content flex-item:nth-child(6),
	.grid-column-content flex-item:nth-child(7),
	.grid-column-content flex-item:nth-child(8) {
		width: 100%;
		max-width: 320px;
		min-width: 320px;
		padding: 5px 10px;
	}

	.grid-column-content flex-item:nth-child(2) .form-container,
	.grid-column-content flex-item:nth-child(6) .form-container,
	.grid-column-content flex-item:nth-child(7) .form-container,
	.grid-column-content flex-item:nth-child(8) .form-container {
		width: 100%;
		max-width: 300px;
		min-width: 300px;
		max-height: 90px;
	}

	.grid-column-content flex-item .form-container textarea {
		min-height: 75px;
		font-size: 14px;
	}

	.grid-column-content flex-item:nth-child(3),
	.grid-column-content flex-item:nth-child(4),
	.grid-column-content flex-item:nth-child(5) {
		width: 100%;
		max-width: 160px;
		min-width: 160px;
	}

	.grid-column-content flex-item:nth-child(9),
	.grid-column-content flex-item:nth-child(10),
	.grid-column-content flex-item:nth-child(11),
	.grid-column-content flex-item:nth-child(12),
	.grid-column-content flex-item:nth-child(13) {
		width: 100%;
		max-width: 140px;
		min-width: 140px;
	}

	.grid-column-content flex-item:nth-child(9),
	.grid-column-content flex-item:nth-child(10),
	.grid-column-content flex-item:nth-child(11),
	.grid-column-content flex-item:nth-child(12),
	.grid-column-content flex-item:nth-child(13) {
		justify-content: center;
	}



/*	========================================= 

		VERTICAL SCROLLING GRIDS
		
   	========================================= */
	.th_filters {
		border-radius: 10px;
		padding: 10px;
		border: 2px solid var(--mm-lighter-grey);
		background-color: var(--mm-white);
	}

	.th_filters flex-container {
		justify-content: space-between;
	}

	.th_filters flex-item {
		background-color: #efefef;
		max-width: 200px;
		width: 100%!important;
		flex-direction: column;
	}

	.th_filters .mm-input-checkbox-label {
		margin-bottom: 0!important;
		margin-top: 10px;
	}


	/* Grid Generic */
	.mm-horizontal-lists flex-container {
		justify-content: space-between!important;
	}


	/* Grid Filters */
	.grid-row-column{
		border-radius: 10px;
		border: 1px solid var(--mm-lighter-grey);		
	}

	.grid-row-column .mm-grid-header {
		border-radius: 10px 10px 0 0;	
	}

	.grid-row-column .mm-grid-header flex-item {
		font-weight: normal!important;
	}

	.grid-row-column flex-item {
		justify-content: flex-start;
	}

	.grid-row-column flex-item:nth-child(1) {
		width: 100%;
		min-width: 80px;
		max-width: 100px;
	}

	.grid-row-column flex-item:nth-child(2) {
		width: 100%;
		min-width: 220px;
		max-width: 240px;
	}

	.grid-row-column flex-item:nth-child(3),
	.grid-row-column flex-item:nth-child(4),
	.grid-row-column flex-item:nth-child(5) {
		width: 100%;
		min-width: 120px;
		max-width: 140px;
	}

	.grid-row-column flex-item:nth-child(3) {
		border-right: 1px solid var(--mm-lighter-grey);
		border-radius: 0;
	}

	.grid-row-column flex-item:nth-child(6),
	.grid-row-column flex-item:nth-child(7),
	.grid-row-column flex-item:nth-child(8),
	.grid-row-column flex-item:nth-child(9) {
		width: 100%;
		min-width: 180px;
		max-width: 200px;
	}

	.grid-row-column flex-item:nth-child(6) .mm-row-form .form-container,
	.grid-row-column flex-item:nth-child(7) .mm-row-form .form-container,
	.grid-row-column flex-item:nth-child(8) .mm-row-form .form-container,
	.grid-row-column flex-item:nth-child(5) .mm-row-form .form-container {
		border: 1px solid #d3d3d3;	
	}

	.grid-row-column flex-item:last-child {
		justify-content: center;
	}

	.grid-row-column flex-item:nth-child(2) a {
		height: 16px;
		width: 16px;
		margin-left: 5px;
	}

	.grid-row-column .mm-simple-scrollbar-y {
		overflow-y: scroll !important;
		overflow-x: hidden !important;
	} 

	.grid-row-column .mm-simple-scrollbar {
		width: 100%;
		max-height: 375px;
		height: 375px;
		overflow-y: hidden;
		overflow-x: scroll;
		scrollbar-color: var(--mm-powder-blue) var(--mm-light-blue);
		scrollbar-width: thin;
	}



/*	========================================= 

		HORIZONTAL / VERTICAL SCROLLING GRIDS
		
   	========================================= */

	/* Scroll Lists */
	.mm-scroll-lists {
		position: relative;
		width: 100%;
		max-width: 1360px;
		z-index: 1;
		margin: auto;
		overflow: auto;
		height: 375px;
		box-shadow: 10px 0px 10px rgba(0,0,0,0.3);	
		scrollbar-color: var(--mm-powder-blue) var(--mm-light-blue);
		scrollbar-width: thin;
	}

	.mm-scroll-lists ul {
		width: 100%;
		min-width: 2100px;
		margin: auto;
		border-collapse: separate;
		border-spacing: 0;	
	}

	.mm-scroll-lists ul li:first-child {
		position: sticky;
		top: 0;
		z-index: 5;
	}

	.mm-scroll-lists .mm-grid-header flex-item:nth-child(1) {
		background-color: var(--mm-light-blue);	
	}

	.mm-scroll-lists flex-item {
		justify-content: flex-start;
	}

	.mm-scroll-lists flex-item:nth-child(1) {
		position: sticky;
		left: 0;
		z-index: 2;
	}

	.mm-scroll-lists ul li:nth-child(2n+2) flex-item:nth-child(1) {
		background-color: var(--mm-light-grey);
	}


	.mm-scroll-lists ul li:nth-child(2n+3) flex-item:nth-child(1) {
		background-color: var(--mm-grey);
	}


	/* Variable */
	.mm-scroll-lists li flex-item:nth-child(1) {
		min-width: 80px;
		max-width: 80px;
		width: 100%;
		justify-content: center;
		/* border-right: 1px solid var(--mm-steel-grey); */
		border-radius: 0;	
	}

	.mm-scroll-lists li flex-item:nth-child(2),
	.mm-scroll-lists li flex-item:nth-child(7) {
		min-width: 120px;
		max-width: 120px;
		width: 100%;
	}

	.mm-scroll-lists li flex-item:nth-child(3),
	.mm-scroll-lists li flex-item:nth-child(8) {
		min-width: 220px;
		max-width: 220px;
		width: 100%;
	}

	.mm-scroll-lists li flex-item:nth-child(4),
	.mm-scroll-lists li flex-item:nth-child(9) {
		min-width: 240px;
		max-width: 240px;
		width: 100%;
	}

	.mm-scroll-lists li flex-item:nth-child(5),
	.mm-scroll-lists li flex-item:nth-child(10) {
		min-width: 100px;
		max-width: 100px;
		width: 100%;
		justify-content: center;
	}

	.mm-scroll-lists li flex-item:nth-child(6),
	.mm-scroll-lists li flex-item:nth-child(11) {
		min-width: 200px;
		max-width: 200px;
		width: 100%;
	}



/*	========================================================

		TABLE BASED GRID VERTICAL / HORIZONTAL SCROLLING	

	======================================================== */

    .table-scroll {
        position: relative;
        width: 100%;
        padding-bottom: 0;
    /*	max-width: 992px;*/
        z-index: 1;
        margin: auto;
        overflow: auto;
        height: 355px;
        scrollbar-color: var(--mm-powder-blue) var(--mm-light-blue);
        scrollbar-width: thin;	
    }

    .table-scroll table {
        width: 100%;
        min-width: 3070px;
        margin: auto;
        border-collapse: separate;
        border-spacing: 0;
    }

    .table-wrap {
        position: relative;
    }

    .table-scroll th,
    .table-scroll td {
        padding: 8px 10px 9px;
        border: none;
        vertical-align: top;
        min-width: 150px;
        max-width: 150px;
        min-height: 40px;
        text-align: left;
        font-size: 14px;
        z-index: 1;	
    }

    .table-scroll td {
        padding: 10px 10px 10px!important;
    }

    .table-scroll thead,
    .table-scroll thead th:first-child {	
        background: var(--mm-light-blue);
    }

    .table-scroll thead th {
        color: var(--mm-default-font-color);
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        font-weight: 500;
        text-transform: capitalize;
        background: var(--mm-light-blue);
        vertical-align: middle;
    }

    .table-scroll thead th a {
        position: absolute;
        right: 20px;
        top: 35%;
    }

    .table-scroll th:first-child,
    .table-scroll td:first-child {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        z-index: 2;
    }	

    .table-scroll tbody td {
        border-bottom: 1px solid var(--mm-steel-grey);
        z-index: 1;
    }

    .table-scroll tbody tr:nth-child(1) td:nth-child(n),
    .table-scroll tbody tr:nth-child(2n+2) td:nth-child(n),
    .table-scroll tbody tr:nth-child(2n+3) td:nth-child(n) 	{
        background: var(--mm-white);		
        vertical-align: middle;
    }  

    .table-scroll thead th:first-child {
        z-index: 5;
    }	


    /* Variable Widths */
    .table-scroll thead th:nth-child(1),
    .table-scroll tbody td:nth-child(1) {
        min-width: 199px;
        max-width: 199px;
        width: 100%;
        border-right: 1px solid var(--mm-steel-grey); 
        border-radius: 0;	
    }

    .table-scroll thead th:nth-child(2),
    .table-scroll tbody td:nth-child(2) {	
        min-width: 100px;
        max-width: 100px;
        width: 100%;
    }

    .table-scroll thead th:nth-child(3),
    .table-scroll tbody td:nth-child(3),
    .table-scroll thead th:nth-child(7),
    .table-scroll tbody td:nth-child(7),
    .table-scroll thead th:nth-child(8),
    .table-scroll tbody td:nth-child(8),
    .table-scroll thead th:nth-child(9),
    .table-scroll tbody td:nth-child(9) {
        min-width: 320px;
        max-width: 320px;
        width: 100%;
    }

    .table-scroll tbody td:nth-child(3) .form-container,
    .table-scroll tbody td:nth-child(7) .form-container,
    .table-scroll tbody td:nth-child(8) .form-container,
    .table-scroll tbody td:nth-child(9) .form-container {
      width: 100%;
      max-width: 300px;
      min-width: 300px;
      max-height: 90px;
    }

    .table-scroll tbody td .mm-textarea textarea {
        font-size: 14px;
        resize: none;
    }

    .table-scroll thead th:nth-child(4),
    .table-scroll tbody td:nth-child(4),
    .table-scroll thead th:nth-child(5),
    .table-scroll tbody td:nth-child(5),
    .table-scroll thead th:nth-child(6),
    .table-scroll tbody td:nth-child(6) {
        min-width: 180px;
        max-width: 180px;
        width: 100%;
    }

    .table-scroll thead th:nth-child(10),
    .table-scroll tbody td:nth-child(10),
    .table-scroll thead th:nth-child(11),
    .table-scroll tbody td:nth-child(11),
    .table-scroll thead th:nth-child(12),
    .table-scroll tbody td:nth-child(12),
    .table-scroll thead th:nth-child(13),
    .table-scroll tbody td:nth-child(13),
    .table-scroll thead th:nth-child(14),
    .table-scroll tbody td:nth-child(14) {
        min-width: 160px;
    /*	max-width: 140px;*/
        width: 100%;
    }

    .table-scroll tbody td:nth-child(10),
    .table-scroll thead th:nth-child(11),
    .table-scroll tbody td:nth-child(11),
    .table-scroll thead th:nth-child(12),
    .table-scroll tbody td:nth-child(12),
    .table-scroll thead th:nth-child(13),
    .table-scroll tbody td:nth-child(13),
    .table-scroll thead th:nth-child(14),
    .table-scroll tbody td:nth-child(14) {
        text-align: center;
    }

    .table-scroll thead th:nth-child(3),
    .table-scroll thead th:nth-child(7),
    .table-scroll thead th:nth-child(8),
    .table-scroll thead th:nth-child(9),
    .table-scroll thead th:nth-child(10),
    .table-scroll thead th:nth-child(11),
    .table-scroll thead th:nth-child(12),
    .table-scroll thead th:nth-child(13),
    .table-scroll thead th:nth-child(14) {
        cursor: default!important;
    }

    .table-scroll thead th:nth-child(3):not(.no-sort)::after,
    .table-scroll thead th:nth-child(7):not(.no-sort)::after,
    .table-scroll thead th:nth-child(8):not(.no-sort)::after,
    .table-scroll thead th:nth-child(9):not(.no-sort)::after,
    .table-scroll thead th:nth-child(10):not(.no-sort)::after,
    .table-scroll thead th:nth-child(11):not(.no-sort)::after,
    .table-scroll thead th:nth-child(12):not(.no-sort)::after,
    .table-scroll thead th:nth-child(13):not(.no-sort)::after,
    .table-scroll thead th:nth-child(14):not(.no-sort)::after,
    .sortable thead th:nth-child(3):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(3):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(7):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(7):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(8):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(8):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(9):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(9):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(10):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(10):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(11):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(11):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(12):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(12):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(13):not(.no-sort)[aria-sort=descending]::after,
    .sortable thead th:nth-child(13):not(.no-sort)[aria-sort=ascending]::after,
    .sortable thead th:nth-child(14):not(.no-sort)[aria-sort=descending]::after, 
    .sortable thead th:nth-child(14):not(.no-sort)[aria-sort=ascending]::after {
        visibility: hidden;
        margin-left: 0;
        content: "";
    }


    /* Sortable Arrow Icon Positioning */	  
    .sortable thead th:not(.no-sort) {
        cursor: pointer;
    }

    .sortable thead th:not(.no-sort)::after, 
    .sortable thead th:not(.no-sort)::before {
        transition: color 0.1s ease-in-out;
        font-size: 1.9em;
        /* color: transparent; */
        height: auto;
        display: inline-block;
        vertical-align: middle;
    }

    .sortable thead th:not(.no-sort)::after {
        margin-left: 3px;
        content: "▸";
    }

    /*
    .sortable thead th:not(.no-sort):hover::after {
        color: inherit;
    }
    */

    .sortable thead th:not(.no-sort)[aria-sort=descending]::after {
        color: inherit;
        content: "▾";
    }

    .sortable thead th:not(.no-sort)[aria-sort=ascending]::after {
        color: inherit;
        content: "▴";
    }

    /*
    .sortable thead th:not(.no-sort).indicator-left::after {
        content: "";
    }
    */

    .sortable thead th:not(.no-sort).indicator-left::before {
        margin-right: 3px;
        content: "▸";
    }

    /*
    .sortable thead th:not(.no-sort).indicator-left:hover::before {
        color: inherit;
    }
    */

    .sortable thead th:not(.no-sort).indicator-left[aria-sort=descending]::before {
        color: inherit;
        content: "▾";
    }

    .sortable thead th:not(.no-sort).indicator-left[aria-sort=ascending]::before {
        color: inherit;
        content: "▴";
    }



/*	=========================================

		STEP PROGRESSION		

	========================================= */

	/* Step Progression */
	.step-progression-lists {
		border: 1px solid var(--mm-lighter-grey);
	}

	.mm-step-progression-figure {
		width: 100%;
		position: relative;
		display: flex;
		justify-content: center;	
		background-color: var(--mm-lighter-grey);
		height: 5px;
		top: 20px;	
	}

	.mm-step-progression-box {
		margin-bottom: 0;
		min-height: 130px;
		list-style: none;
		width: 100%;
		padding: 0;
		display: flex;
		justify-content: space-evenly;		
	}

	.mm-step-progression-box li {
		border-right: 1px solid var(--mm-lighter-grey);
		padding-top: 20px;
		padding-bottom: 20px;
	    width: 100%;	
	}

	.mm-step-progression-box li:last-child {
		border-right: 0; 
	}

	.mm-step-progression-box li span {
		width: 100%;
		background-color: var(--mm-light-blue);
		position: absolute;
		top: 0;
		left: 0;
		display: inline-flex;
		height: 5px;
		align-items: flex-end;		
	}

	.mm-step-progression-box li.mm-step-progression-active {
		/*background-color: #D9F5F2;*/
background-color: #D3EEE1;
		-webkit-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2);
		box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2);	
	}

	.mm-step-progression-box li.mm-step-progression-active a,
	.mm-step-progression-box li.mm-step-progression-complete a {
		max-height: 130px;
		padding: 20px 0;
		display: block;
		margin: -20px 0;	
	}

	.mm-step-progression-box li:first-child.mm-step-progression-active {	
		border-radius: 10px 0 0 10px;
	}

	.mm-step-progression-box li:last-child.mm-step-progression-active {	
		border-radius: 0 10px 10px 0;
	}

	.mm-step-progression-box li.mm-step-progression-complete span,
	.mm-step-progression-box li.mm-step-progression-active span {
		background-color: var(--mm-green)!important;
	/*    width: 50%;*/
	}

	.mm-step-progression-overlay {
		background-color: var(--mm-light-blue);
		top: -20px;
		border-radius: 50%;
		max-width: 50px;
		max-height: 50px;
		width: 40px;
		height: 40px;
		position: inherit;
		color: var(--mm-white);
		font-size: 18px;
		align-items: center;
		display: flex;
		justify-content: center;		
	}

	.mm-step-progression-box li.mm-step-progression-active .mm-step-progression-overlay {
		background-color: var(--mm-green);
	}

	.mm-step-progression-box li .mm-step-progression-50 {
		width: 50%
	}

	.mm-step-progression-box li .mm-step-progression-100 {
		width: 100%
	}

	.mm-step-progression-box li.mm-step-progression-active .circular {
		border: 5px solid var(--mm-white);
		width: 28px!important;
		height: 28px!important;
		display: flex;
		border-radius: 50%;
		margin: 1px;
	}

	.mm-step-progression-box li .checked {
		background-color: var(--mm-green);
		top: -20px;
		border-radius: 50%;
		max-width: 50px;
		max-height: 50px;
		width: 40px;
		height: 40px;
		position: inherit;
		color: var(--mm-white);
		font-size: 18px;
		align-items: center;
		display: flex;
		justify-content: center;		
	}

	.mm-step-progression-box li .check {
		background-color: transparent !important;
		display: inline-block !important;
		transform: rotate(45deg);
		height: 16px !important;
		width: 8px !important;
		border-bottom: 3px solid var(--mm-white) !important;
		border-right: 3px solid var(--mm-white) !important;
		left: 14px !important;
		top: 7px !important;
	}


	/* List Progress */
	.list-progress--step {
		color: #959595;
		text-transform: uppercase;
		font-size: 12px;
		font-weight: 500;
	}

	.list-progress--plan {
		font-size: 16px;
		color: var(--mm-default-font-color);
		font-weight: 500;
	}



/*	=========================================

		PROGRESS PROGRESSION		

	========================================= */
	
	.mm-progress-percentage {
		display: flex;
		width: 300px;
		margin-left: 0%;
		justify-content: flex-end;	
	}

	.mm-progress-percentage li {
		width: 35%;
		margin-left: -13.5%;	
	}

	.mm-progress-percentage li:first-child,
	.mm-progress-percentage li:last-child {
		width: 22%;
	}

	.mm-progress-percentage li:first-child .mm-progress-figure,
	.mm-progress-percentage li:first-child .list-progress {
		justify-content: flex-start;
		display: flex;
	}

	.mm-progress-percentage li:last-child .mm-progress-figure,
	.mm-progress-percentage li:last-child .list-progress {
		justify-content: flex-end;
		display: flex;
	}

	.mm-progress-percentage .mm-progress-overlay {
		background-color: var(--mm-light-blue);
		top: -12px;
		width: 24px;
		height: 24px;
		position: inherit;
		color: var(--mm-white);
		font-size: 18px;
		align-items: center;
		display: flex;
		justify-content: center;	
		border-radius: 50%;
		max-width: 50px;
		max-height: 50px;	
	}

	.mm-progress-percentage .mm-progress-figure {
		width: 100%;
		position: relative;
		display: flex;
		justify-content: center;
		background-color: var(--mm-light-blue);
		height: 3px;
		top: 10px;
	}

	.mm-progress-percentage .mm-progress-active,
	.mm-progress-percentage .mm-progress-complete {
		display: block !important;
	}

	.mm-progress-percentage .mm-progress-complete {
		color: #00AB95;
		font-size: 12px;
	}

	.mm-progress-percentage .mm-progress-active {
		color: var(--mm-default-font-color);
		font-size: 12px;	
	}

	.mm-progress-percentage .mm-progress-active span {
		background-color: var(--mm-light-blue)!important;
	}

	.mm-progress-complete .mm-progress-figure {
		background-color: var(--mm-green);
	}

	.mm-progress-complete .mm-progress-overlay {
		background-color: var(--mm-green);
	}

	.mm-progress-complete .mm-progress-overlay span {
		background-color: var(--mm-white) !important;
	}

	.mm-progress-complete .mm-progress-overlay .circular {
		border: 7px solid var(--mm-green)!important;
		width: 10px !important;
		height: 10px !important;
		border-radius: 50%;
	}

	.mm-progress-percentage li:last-child.mm-progress-active span {
		background-color: var(--mm-white) !important;
	}



/*	========================================= 

		TASK TIMELINE
		
   	========================================= */

	.mm-timeline-block {
		list-style: none;
		width: 100%;
		padding: 0;
		display: inline-flex;		
	}

	.mm-timeline-block li {
		width: 15%;
		display: flex;
		justify-content: center;
		align-items: center;		
	}

	.mm-timeline-block li:first-child,
	.mm-timeline-block li:last-child {
		width: 8%;		
	}

	.mm-timeline-block li:first-child .mm-timeline {
		justify-content: flex-start;
	}

	.mm-timeline-block li:last-child .mm-timeline {
		justify-content: flex-end;
	}

	.mm-timeline {
		width: 100%;
		margin: 0px;
		position: relative;
		height: 75px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.mm-time-line {
		width: 100%;
		height: auto;
    	border-top: 2px solid var(--mm-default-font-color);	
		opacity: .7;
		display: inline-flex;
	}

	.mm-timeline-overlay {
		border-radius: 50%;
		position: absolute;
	}

	.mm-timeline-overlay-small {
		border-radius: 50%;
		position: absolute;
	}

	.mm-timeline-red-small {
		background-color: var(--mm-red);	
		width: 20px;
		height: 20px;
	}

	.mm-timeline-red-large {
		background-color: var(--mm-red);
		width: 40px;
		height: 40px;
	}

	.mm-timeline-green-small {
		background-color: var(--mm-green);
		width: 20px;
		height: 20px;
	}

	.mm-timeline-green-large {
		background-color: var(--mm-green);
		width: 40px;
		height: 40px;
	}



/*	========================================= 

		STEP-BOX TIMELINE
		
   	========================================= */

	.mm-step-box {
		list-style: none;
		width: 100%;
		padding: 0;
		display: flex;
		justify-content: space-evenly;	
		margin-bottom: 40px;
        min-height: 130px;
	}

	.mm-step-box li {
		width: 100%;
	}

	.mm-step-box li span {
		width: 100%;
		display: inline-flex;
		height: 5px;
		align-items: flex-end;	
	}

	.mm-step-box li span {
		background-color: var(--mm-dove-grey);
		position: absolute;
		top: 19px;	
	}

	.mm-step-box li.mm-step-active span {
		background-color: var(--mm-powder-blue)!important;
	}

	.mm-step-box li.mm-step-active .mm-step-overlay {
		background-color: var(--mm-powder-blue);
	}

	.mm-step-overlay {		
		background-color: var(--mm-dove-grey);	
		border-radius: 50%;
		max-width: 50px;
		max-height: 50px;
		width: 40px;
		height: 40px;
		position: inherit;
		color: var(--mm-white);
		font-size: 18px;
		align-items: center;
		display: flex;
		justify-content: center;	
	}

	.mm-step-figure {
		width: 100%;
		position: relative;
		display: flex;
		justify-content: center;	
	}

	.mm-step-figure img {
		width: 100%;
		height: auto;
		margin: 15px auto 30px;
		min-height: 5px;		
	}



/*	========================================= 

		VERTICAL STEP-BOX TIMELINE
		
   	========================================= */
	.mm-step-box-vertical {
		list-style: none;
		width: 7%;
		padding: 0;
		display: flex;
		justify-content: space-between;
		margin-bottom: 40px;
		flex-direction: column;
		max-height: 415px;
	}

	.mm-step-box-vertical li {
		width: 100%;
		position: relative;
	}

	.mm-step-box-vertical li span {
		width: 2px;
		display: inline-flex;
		height: 85px;
		align-items: center;
		top: 20px;
		justify-content: center;
	}

	.mm-step-box-vertical li:last-child span {
		display: none;
	}

	.mm-step-box-vertical li .mm-step-overlay.mm-step-small {
		width: 20px;
		height: 20px;
	}

	.mm-step-box-vertical li:nth-child(2) .mm-step-overlay,
	.mm-step-box-vertical li:nth-child(4) .mm-step-overlay {
		top: -15px;
	}

	.mm-step-box-vertical li:nth-child(3) .mm-step-overlay {
		top: -20px;
	}

	.mm-step-box-vertical li .mm-step-figure {
		position: revert!important;
	}

/*
	.mm-step-box li:nth-child(5).mm-step-active span {
		height: 80px;
	}
*/



/*	========================================= 
		
		PAGINATION
		
   	========================================= */
	.mm-pagination-container {
		margin-top: 30px;
	}

	.mm-pagination-container .button {
		min-width: 140px;	
	}

	.mm-pagination-container .button .arrow-right {
		margin-left: 15px;
		margin-top: 5px;
	}

	.mm-pagination-container .button .arrow-left {
		margin-right: 15px;
		margin-top: 5px;
	}

	.mm-pagination-container .button .arrow-right img,
	.mm-pagination-container .button .arrow-left img {
		margin: 0!important;
	}

	.mm-pagination-block {
		list-style: none;
		width: 100%;
		max-width: 330px;
		padding: 0;
		display: inline-flex;	
		justify-content: center;
		margin: 0 30px;		
	}

	.mm-pagination-block-400 {
		max-width: 400px!important;
		margin: 0!important;
	}

	.mm-pagination-block li {
		width: 18%;
		display: flex;
		justify-content: center;
		align-items: center;		
	}

	.mm-pagination-block li:first-child,
	.mm-pagination-block li:nth-child(2),
	.mm-pagination-block li:nth-last-child(2),
	.mm-pagination-block li:last-child {
		width: 10%;		
	}

	.mm-pagination-block li:first-child .mm-pagination {
		justify-content: flex-start;
	}

	.mm-pagination-block li:last-child .mm-pagination {
		justify-content: flex-end;
	}

	.mm-pagination {
		width: 100%;
		margin: 0px;
		position: relative;
		height: 75px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.mm-pagination-overlay {
		border-radius: 50%;
		position: absolute;
	}

	.mm-pagination-overlay-small {
		border-radius: 50%;
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 600;
		font-size: 16px		
	}

	.mm-pagination-blue-small {
		background-color: var(--mm-powder-blue);	
		width: 20px;
		height: 20px;
		color: var(--mm-white);
	}

	.mm-pagination-blue-large {
		background-color: var(--mm-powder-blue);
		width: 40px;
		height: 40px;
		color: var(--mm-white);
	}

	.mm-pagination-grey-small {
		background-color: var(--mm-lighter-grey);
		width: 20px;
		height: 20px;
	}

	.mm-pagination-grey-large {
		background-color: var(--mm-lighter-grey);
		width: 40px;
		height: 40px;
	}



/*	========================================= 
		
		ACTION CENTRE
		
   	========================================= */

	.hp-action-centre {
		width: 100%;
		max-width: 1280px;
		padding: 20px 30px;
	}

	.hp-action-centre-percentage {
		width: 100%; 
		height: 80px; 
		max-width: 100px; 
		background-color: var(--mm-orange); 
		border-radius: 50%; 
		font-size: 12px; 
		color: var(--mm-white); 
		text-align: center; 
		padding: 10px 0;	
	}

	.hp-action-centre-list {
		display: flex;
	}

	.hp-action-centre-list .mm-two-horizontal-lists {
		width: 100%;
		/*margin-left: 40px;*/
		margin-top: -15px;
	}

	.hp-action-centre-list .mm-two-horizontal-lists flex-container {
		display: flex;
		justify-content: flex-start;
		margin-bottom: 35px;
		align-items: stretch;
	}

	.hp-action-centre-list .mm-two-horizontal-lists flex-item {
		width: auto;
		justify-content: flex-start;
		padding: 0;
	}

	.hp-action-centre-list .mm-two-horizontal-lists flex-item:nth-child(1) {
		margin-right: 40px;
		width: 5%;
	}

	.hp-action-centre-list .mm-two-horizontal-lists flex-item:nth-child(2) {
		width: 35%;
		margin-right: 80px;
	}

	.hp-action-centre-list .mm-two-horizontal-lists flex-item:nth-child(3) {
		width: 50%;
	}

	.hp-action-centre-list .mm-two-horizontal-lists a.primary-button {
		min-width: 375px;
		max-width: 400px;
		width: 100%;	
		min-height: 40px;
		border-radius: 40px;
		font-size: 20px;
		font-weight: lighter;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3)!important;
		-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3)!important;
		box-shadow: 0px 3px 6px rgb(65, 65, 65, .3)!important;	
	}



/*	========================================= 

		CONTENT DISPLAY LISTS
		
   	========================================= */

	/* Content Display Lists Header */ 
	.content_display_lists__header {	
		background-color: var(--mm-orange);
		min-height: 40px;
		color: var(--mm-white);
		font-size: 16px;
		text-align: left;
		padding: 10px 0;
		border-radius: 6px 6px 0 0;
		height: auto;
	}

	.content_display_lists__footer {	
		background-color: var(--mm-orange);
		min-height: 20px;
		color: var(--mm-white);
		font-size: 16px;
		text-align: left;
		padding: 10px 0;
		border-radius: 0 0 6px 6px;
		height: auto;
	}

	.content_display_lists__header h3 {
		color: var(--mm-white);
	}

	.content_display_lists__header ul,
	.content_display_lists__footer ul {
		width: 100%;
	}

	.content_display_lists__header li span {
		width: 40px;
		height: 40px;
		background-color: var(--mm-white);
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 4px;
		margin-left: 20px;
	}

	.content_display_lists__header li:last-child {
		align-items: center;
	}

	.content_display_lists__header li img {
		width: 24px;
		height: 24px;
	}


	/* Orange Content Display Containers */
	.content_display_lists {
		display: block;
		width: 100%;	
		margin-bottom: 20px;	
	}

	.content_display_lists__block {
		max-width: 1560px; 
		border: 2px solid var(--mm-orange); 
		border-radius: 10px; 
		width: 100%; 
		min-height: 196px; 
		height: auto; 
		display: inline-block; 
		padding-bottom: 20px;
/*		margin-top: 40px;*/
		background-color: var(--mm-white);	
	}

	.content_display_lists__icons span {
		background-color: var(--mm-white);
		width: 40px;
		height: 30px;
		padding: 5px 0;
		margin-right: 10px;
		margin-left: 10px;
		border-radius: 4px;	
	}

	.content_display_lists li .input-icon {
		top: 23px;
	}



/*	========================================= 

		CARD LISTS
		
   	========================================= */

	.mm-card_lists {
		display: flex;
		justify-content: space-between;
	}

	.mm-card_lists li {
/*		max-width: 456px; */
		border: 2px solid var(--mm-powder-blue); 
		border-radius: 10px; 
		width: 100%; 
		min-height: 196px; 
		height: auto; 
		margin-right: 15px;	
	}

	.mm-card_lists li:last-child {
		margin-right: 0;	
	}

	.mm-card_lists li h3 {	
		margin: 0;
        font-weight: 500;
	}

	.mm-card_lists li .mm-card_lists--header {
		background-color: var(--mm-powder-blue);
		/*min-height: 60px;*/
		max-height: 60px;
		color: var(--mm-white);
		text-align: center;
		padding: 15px 20px;
		border-radius: 6px 6px 0 0;
	}

	.mm-card_lists flex-container {
		margin-bottom: 0px;
	}

	.mm-card_lists flex-item:first-child {
		justify-content: flex-start;
	}

	.mm-card_lists flex-item:last-child {
		justify-content: flex-end;
	}

	.blue-rounded {
		background-color: var(--mm-powder-blue);
		width: 40px;
		height: 40px;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 50%;
		font-size: 20px;
		color: var(--mm-white);
		font-weight: bold;	
	}




/*	========================================= 

				USER INFORMATION CARDS
		
   	========================================= */

.mm-user-info-cards {
	width: 100%;
	max-width: 1320px;
	display: flex;
}

.mm-user-info-cards li {
    border-radius: 10px;
    width: 100%;
    max-width: 280px;
    height: 100%;
    max-height: 350px;
    min-height: 310px;
    padding: 20px 20px;
    background-color: var(--mm-grey);
    margin-right: 50px;
    /* margin-bottom: 50px; */
    font-size: 14px;
    min-width: 240px;
}

.mm-user-info-cards li h4 {
	margin: 0 0 20px 0;
    font-weight: 500;
}

.mm-user-info-cards li:nth-child(4n) {
	margin-right: 0;
}

.mm-user-info-cards li p {
    font-size: 14px;
}

.mm-user-info-icon {
	margin-bottom: 10px;
}

.mm-user-info-icon img {
	width: auto /*100px*/;
	height: auto /*100px*/;
	border-radius: 50%;
}

.mm-user-info-links li {
	height: auto;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	font-size: 14px;
	padding: 5px 0;
	margin: 0;
	min-height: auto;
}

.mm-user-info-links li a {
    width: 210px;
    display: block;
    word-wrap: break-word;	
    font-size: 12px;
}

.mm-user-info-links img {
	width: 16px;
	height: 16px;
	margin-right: 20px;
}




/*	========================================= 

				RADIO CARD
		
   	========================================= */

	
	label.radio-card {
		cursor: pointer;
		margin:0 30px;
	}

	label.radio-card .card-content-wrapper {
		background: var(--mm-white);
		border-radius: 10px;
		min-width: 370px;	
		max-width: 370px;
		min-height: 270px;
		max-height: 270px;	
		padding: 15px;
		display: flex;
		transition: 200ms linear;
		flex-direction: column;
		align-items: center;
		-webkit-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
			-moz-box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
			box-shadow: 0px 3px 6px rgb(65, 65, 65, .3);
		width: 100%;
	}

	label.radio-card .check-icon {
		left: auto;
		right: 15px;
		top: 15px;
	}

	label.radio-card input[type=radio] {
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
	}

	label.radio-card input[type=radio]:checked + .radiomark + .card-content-wrapper {
		box-shadow: 0 2px 4px 0 rgba(219, 215, 215, 0.5), 0 0 0 2px transparent;
		background-color: #e5f6f8;
	}

	.card-content-container {
		background-color: var(--mm-grey); 
		display: flex; 
		align-items: center; 
		justify-content: center; 
		padding: 50px 0;
	}

	label.radio-card .card-content {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	label.radio-card .card-content img {
		width: 120px;
		height: 120px;
	}



/*	========================================= 

				SELECTION HEADER
		
   	========================================= */

	.selection_header {
		background-color: var(--mm-grey); 
		height: 60px; 
		width: 100%; 
		display: flex; 
		align-items: center;
	}

	.selection_header li:nth-child(1) {
		width: 20px; 
		height: 35px; 
		padding: 12px 10px;	
	}

	.selection_header li:nth-child(2) {
		width: 60px; 
		height: 60px; 
		display: flex;
		align-items: center; 
		justify-content: center; 	 
		background-color: var(--mm-lighter-grey)
	}

	.selection_header li:nth-child(2) img {
		width: 40px;
		height: 40px;
	}



/*	========================================= 

				MEDICAL AID LISTS
		
   	========================================= */

	.mm-option-header-lists {
		background-color: var(--mm-grey);
		width: 100%;
		max-width: 1366px;
		color: #000;
		font-size: 14px;
		font-weight: 500;
		min-height: 60px;
		line-height: 20px;
		padding: 10px 0;
	/*	height: 80px;*/
		margin-top: 40px;
		margin-bottom: 40px;
	}

	.mm-option-header-lists li {
		display: flex;
	}

	.mm-option-header-lists .current-scheme {
		max-width: 620px;
		width: 100%;
	}

	.mm-option-header-lists .current {
		flex-direction: column;	
		display: flex;
		margin-left: 25px;
		max-width: 325px;
		width: 100%;
	}

	.mm-option-header-lists .med-scheme-icon {
		background: var(--mm-lighter-grey); 
		display: flex; 
		justify-content: center; 
		align-items: center; 
		max-width: 80px; 
		max-height: 80px;
		padding: 0.465em 13px;
	}

	.mm-option-header-lists .options {
		max-width: 750px;
		width: 100%;
		font-weight: normal;
	}

	.mm-option-header-lists .options ul {
		width: 100%;
	}

	.mm-option-header-lists .options li {
		display: flex;
		max-height: 40px;
		align-items: center;
		padding: 10px;
	}

	.mm-option-header-lists .options li span {
		width: 33%;
	}

	.mm-option-header-lists .options li:first-child {
		background: var(--mm-light-blue);
		border-radius: 10px 10px 0 0;
		font-weight: 500;
	}

	.mm-option-header-lists .options li:last-child {
		background: var(--mm-light-grey);
		border-radius: 0 0 10px 10px;
	}



/*	========================================= 

		DEFAULT TOGGLED CONTENT
		
   	========================================= */

	.mm-collapsible input[type='checkbox'] {
		display: none;
	}

	.mm-collapsible {
		border-bottom: 1px solid var(--mm-grey);
		padding: 20px 0 0;
	}

	.mm-label-toggle {
		display: block;
		color: var(--mm-default-font-color);
		cursor: pointer;
		transition: all 0.25s linear;
		position: relative;
	}

	.mm-label-toggle::before {
		content: ' ';
		display: inline-block;
		border-top: 8px solid transparent;
		border-bottom: 8px solid transparent;
		border-left: 8px solid var( --mm-powder-blue-state);
		vertical-align: middle;
		margin-right: .7rem;
		transform: rotate(90deg) translateY(0px);
		transition: transform .2s linear;
		position: absolute;
		right: 0;
		top: 10px;	
	}

	.mm-toggle:checked+.mm-label-toggle::before {
		transform: rotate(270deg) translateX(-3px)
	}

	.mm-collapsible-content {
		max-height: 0px;
		overflow: hidden;
		transition: max-height .3s ease-in-out;
	}

	.mm-toggle:checked + .mm-label-toggle + .mm-collapsible-content {
		max-height: 4096px;
	}

	.mm-toggle:checked+.mm-label-toggle {
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
	}

	.mm-collapsible-content .mm-content-inner {
		background-color: transparent;
	}

	.mm-collapsible-content p {
		margin-bottom: 0;
	}



/*	========================================= 

		GREEN TOGGLED CONTENT
		
   	========================================= */

	.mm-green-collapsible input[type='checkbox'] {
		display: none;
	}

	.mm-green-collapsible {
		border-bottom: 1px solid var(--mm-grey);
		padding: 0;
		border-radius: 10px;
		margin-bottom: 20px;
		margin-top: 0;
	}

	.mm-green-label-toggle {
		display: block;
		cursor: pointer;
		transition: all 0.25s linear;
		position: relative;
		background-color: var(--mm-green);
		color: var(--mm-white) !important;
		padding: 20px 20px;
		text-transform: uppercase;
		border-radius: 10px;
		font-size: 20px;		
	}

	.mm-green-label-toggle::before {
		content: ' ';
		display: inline-block;
		border-top: 12px solid transparent;
		border-bottom: 12px solid transparent;
		border-left: 12px solid var(--mm-white);
		vertical-align: middle;
		margin-right: 1.7rem;
		transform: rotate(90deg) translateY(0px);
		transition: transform .2s linear;
		position: absolute;
		right: 0;
		top: 20px;	
	}

	.mm-green-toggle:checked+.mm-green-label-toggle::before {
		transform: rotate(270deg) translateX(-3px)
	}

	.mm-green-collapsible-content {
		border-radius: 0 0 10px 10px;
		max-height: 0px;
		overflow: hidden;
		transition: max-height .03s ease-in-out;
	}

	.mm-green-toggle:checked + .mm-green-label-toggle + .mm-green-collapsible-content {
		max-height: 4096px;
		border: 2px solid var(--mm-green);
	}

	.mm-green-toggle:checked+.mm-green-label-toggle {
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
	}

	.mm-green-collapsible-content .mm-green-content-inner {
		background-color: transparent;
	}

	.mm-green-collapsible-content p {
		margin-bottom: 0;
	}


/*	========================================= 

		TABS
		
   	========================================= */

	.tab_wrapper {
		margin-top: 40px; 
		display: inline-block; 
		width: 100%;	
	}

	ul.tabs {
		margin: 0;
		padding: 0;
		float: left;
		list-style: none;
		height: 60px;
		width: 100%;
		display: inline-flex;
	}

	ul.tabs li {
		float: left;
		margin: 0;
		cursor: pointer;
		padding: 0 .526em;
		height: 60px;
		line-height: normal;
		background-color: var(--mm-grey);
		color: var(--mm-default-font-color);
		overflow: hidden;
		position: relative;
		margin-right: 10px;
		/* max-width: 390px;*/
		max-width: none;
		width: auto;	
		flex: auto;
		font-size: 20px;
		font-weight: 500;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;		
	}

	ul.tabs li:last-child { 
		margin-right: 0!important;
	}

	ul.tabs li:hover {
		background-color: var(--mm-white);
		color: var(--mm-powder-blue);	
		border-bottom: 2px solid var(--mm-white);
		-webkit-box-shadow: 0px -10px 15px -5px rgb(196, 196, 196,1);
		-moz-box-shadow: 0px -10px 15px -5px rgb(196, 196, 196,1);
		box-shadow: 0px -10px 15px -5px rgb(196, 196, 196,1); 	
	}

	ul.tabs li.active {
		background-color: var(--mm-white);
		color: var(--mm-powder-blue);	
		border-bottom: 2px solid var(--mm-white);
		display: flex;
		-webkit-box-shadow: 0px -10px 15px -5px rgb(196, 196, 196,1);
		-moz-box-shadow: 0px -10px 15px -5px rgb(196, 196, 196,1);
		box-shadow: 0px -10px 15px -5px rgb(196, 196, 196,1);  	
	}

	ul.tabs li img {
		filter: invert(43%) sepia(1%) saturate(0%) hue-rotate(112deg) brightness(88%) contrast(86%);
		margin: 10px 0;
	}

	ul.tabs li:hover img,
	ul.tabs li.active img {
		filter: none;
	}


	.tab_container {
		border-top: none;
		float: left;
		width: 100%;
		background: var(--mm-white);
		overflow: auto;
		padding-bottom: 20px;
		-webkit-box-shadow: 0px 5px 15px -4px rgb(172, 172, 172,1);
		-moz-box-shadow: 0px 5px 15px -4px rgb(172, 172, 172,1);
		box-shadow: 0px 5px 15px -4px rgb(172, 172, 172,1);	
	}

	.tab_content {
		padding: 20px;
		display: none;
	}

	.tab_drawer_heading { 
		display: none; 
	}



/*	==================================================== 

		DRAG 'N DROP CONTAINER // DRAG 'N DROP LISTS
		
   	==================================================== */

	.drag-n-drop-container {
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		height: 385px;
		opacity: 0;
		visibility: hidden;
	}

	.drag-n-drop-container .list-item {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		border: 1px solid var(--mm-lighter-grey);
		border-radius: 4px;
		display: flex;
		align-items: center;
		background-color: var(--mm-grey);
		box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 2px 0px;
		flex-wrap: wrap;
		padding: 20px 0;
		max-height: 70px;
		max-width: 1200px;
		justify-content: space-between;
		cursor: pointer;
	}

	.drag-n-drop-container .order {
		margin-right: 40px;
		padding-left: 20px;
	}



/*	========================================= 

		DRAG 'N DROP BLOCK
		
   	========================================= */

	.drag-n-drop-block {
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		height: 385px;
		opacity: 0;
		visibility: hidden;
	}

	.drag-n-drop-block .order-block {
		margin-right: 40px;
		padding-left: 20px;
	}
    
    .drag-n-drop-modal {
        max-width: 960px!important;
        width: auto !important;    
    }


    /* List Item Block */
    .drag-n-drop-block .list-item-block {
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 4px;
        border: 0;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;        
        background-color: transparent;
        box-shadow: none;
        max-height: none;
        width: 556px;
        user-select: none!important;
        padding: 0;
        margin-bottom: 20px;	        
    }

    .drag-n-drop-block .list-item-block li:nth-child(1) {
        background-color: var(--mm-light-grey);
        max-width: 500px;
        width: 100%;
        max-height: 150px;
        /* border-radius: 10px; */
    }

    .drag-n-drop-block .list-item-block li:nth-child(1) a {
        width: 520px;
        height: 150px;
    }

    .drag-n-drop-block .list-item-block li .item-content-container .item-content-details {
        padding-bottom: 20px;
    }

    .drag-n-drop-block .list-item-block li .item-content-container button {
        position: absolute;
        min-width: 140px;
        height: 30px;
        font-size: 14px;
        right: 0;
    }

    .drag-n-drop-block .list-item-block li .item-content-container button .mm-tooltip-icon .mm-tooltiptext {
        left: -50px;
        top: -46px;
    }

    .drag-n-drop-block .list-item-block li:nth-child(2) img {
        width: 25px;
        height: 25px;
    }

    .drag-n-drop-block .list-item-block li:nth-child(2) .order-block {
        visibility: hidden;
        display: none;
    }


    /* Side Item */
    .drag-n-drop-block .side-item {
        background-color: var(--mm-grey);
        height: 130px;
        width: 36px;
        border-radius: 0px 10px 10px 0;
        padding: 0!important;
        justify-content: center!important;
    }

    .drag-n-drop-block .side-item ul {
        display: flex;
        flex-direction: column;
        align-items: baseline;
        justify-content: space-around;	
    }

    .drag-n-drop-block .side-item ul li {
        width: 24px;
        height: 24px;
        border-radius: 50%;		
        display: flex;
        align-items: center;
        justify-content: center;	
    }

    .drag-n-drop-block .side-item ul li .mm-tooltip{
        width: 24px;
        height: 24px;
        margin-top: 4px;
        line-height: 1.5em;
    }

    .drag-n-drop-block .side-item ul li .mm-tooltip-icon .mm-tooltiptext {
        left: -55px;
        top: -28px;
        width: 125px;
        padding: 2px;
    }

    .drag-n-drop-block .side-item li img {
        height: 15px!important;
        width: 15px!important;
    }

    .drag-n-drop-block .side-item li:nth-child(1) {
        background-color: var(--mm-powder-blue);
        background: url("../images/dnd-move-icon.png") no-repeat center center var(--mm-powder-blue);
        height: 24px;
        width: 24px;
    }

    .drag-n-drop-block .side-item li:nth-child(2) {
        background-color: var(--mm-green);
    }

    .drag-n-drop-block .side-item li:nth-child(3) {
        background-color: var(--mm-red);
    }


    /* Item Container */
    .item-content-container {
        max-width: 520px;
        min-width: 520px;
        width: 100%;		
        background-color: var(--mm-light-grey);
    }

    .item-content-container ul {
        display: flex;
        padding: 0 10px;
    }

    .item-content-container li:nth-child(2) {
        flex-direction: column;
        display: flex;
        line-height: normal;
        padding: 10px;	
    }

    .item-content-container li:nth-child(2) span:nth-child(3),
    .item-content-container li:nth-child(2) span:nth-child(4) {
        color: var(--mm-default-font-color);	
    }

    label.mm-input-label input[type=radio]:checked + .radiomark + .item-content-container {
        box-shadow: 0 2px 4px 0 rgba(219, 215, 215, 0.5), 0 0 0 2px transparent;
        background-color: var(--mm-white);
    }

    .item-content-container .item-content-card {
        background-color: transparent!important;
        padding-bottom: 20px;
    }

    .item-content-container .item-content-card li:nth-child(1) {    
        max-width: 60px!important
    }

    .item-content-container span {
        padding: 0!important;
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details {
        display: flex;
        font-size: 10px;
        padding: 5px 0 0 0!important;
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details li {
        max-width: 200px!important;
        width: 100%;
        padding: 0!important;
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details li ul {
        justify-content: flex-start;
        align-items: center;
        padding: 0!important;
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details ul li {
        display: flex;
        flex-direction: row!important;
        align-items: center;
        padding: 0 0 3px 0!important;
        max-width: 100px !important;	
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details ul li:nth-child(1) {	
        color: var(--mm-default-font-color);	
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details ul li:nth-child(2) {	
        font-weight: 500;	
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details ul .teal-circle {
        width: 14px!important;
        height: 14px;
        border-radius: 50%;
        padding: 0 !important;
        justify-content: center;	
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details ul .clear-circle {
        width: 14px !important;
        height: 14px;
        border-radius: 50%;
        padding: 0 !important;
        justify-content: center;	
    }

    .item-content-container .item-content-card li:nth-child(2) .item-content-details ul li .green-circle,
    .item-content-container .item-content-card li:nth-child(2) .item-content-details ul li .red-circle {
        width: 8px;
        height: 8px;
        padding: 0!important;
    }


    /* Succession Placeholder */
    .drag-n-drop-block .succession_placeholder {
        cursor: default!important;
        touch-action: none!important;
    }

    .drag-n-drop-block .succession_placeholder .order-block {
        visibility: hidden;
        display: none;	
    }


    /* Item Content Card */
    .drag-n-drop-block .item-content-card li {
        margin: 0!important;
        width: 100%!important;
    }

    .drag-n-drop-block .item-content-card li img {
        width: 60px;
        height: 60px;
        border-radius: 50%;
    }

    .drag-n-drop-block .item-content-card .org-chart-regular {
        background-color: var(--mm-powder-blue);
        border-radius: 30px;
        height: 100px;
        width: 60px;	
        margin: 10px 0;
    }

    .drag-n-drop-block .item-content-card .org-chart-contractor {
        background-color: var(--mm-green);
        border-radius: 30px;
        height: 100px;
        margin: 10px 0;
    }

    .drag-n-drop-block .item-content-card .org-chart-external {
        background-color: var(--mm-burnt-orange);
        border-radius: 30px;
        height: 100px;
        margin: 10px 0;
    }

    .drag-n-drop-block .item-content-card .org-chart-vacant {
        background-color: #AEAEAE;
        border-radius: 30px;
        height: 100px;
        margin: 10px 0;
    }

    .drag-n-drop-block .item-content-card .org-chart-regular span,
    .drag-n-drop-block .item-content-card .org-chart-contractor span,
    .drag-n-drop-block .item-content-card .org-chart-external span,
    .drag-n-drop-block .item-content-card .org-chart-vacant span {
        display: inline-flex;
        padding: 0 3px!important;
        font-size: 10px;
        color: var(--mm-white);
    }

    .drag-n-drop-block .item-content-card .org-demographic {
        display: flex;
        width: 30px;
        text-align: center;
        padding: 5px 15px 10px 15px;	
    }

    .drag-n-drop-block .item-content-orange-border {
        border: 2px solid var(--mm-orange)!important;
        border-radius: 10px;
    }

    .drag-n-drop-block .item-content-red-border {
        border: 2px solid var(--mm-red)!important;
        border-radius: 10px;
    }

    .drag-n-drop-block .item-content-zero-border {
        border: 2px solid transparent!important;
        border-radius: 10px;
    }


    /* Role Action */
    .drag-n-drop-block .role-action {
        width: 24px;
        height: 24px;
        background-color: var(--mm-white);
        border-radius: 50%;
        display: flex !important;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
        margin-top: 3px;
    }

    .drag-n-drop-block .role-action img {
        width: 16px!important;
        height: 16px!important;
        margin: 0!important;
    }

    .drag-n-drop-block .role-action .mm-tooltiptext {
        color: var(--mm-default-font-color)!important;
        font-size: 16px!important;
        width: 100px!important;
        left: -40px!important;
        justify-content: center;
    }

    .drag-n-drop-block .bottom-link a {
        position: absolute;
        color: var(--mm-default-font-color)!important;
        bottom: 15px;
        z-index: 50;
        height: 10px !important;
        width: auto !important;
        left: 45%;
        text-decoration: underline;
        font-size: 10px;
    }


    /* Full Card Details Modal */
    .full-card-details {
        min-width: 760px;
        width: 100%;
        position: relative;
    }

    .full-card-details .item-content-container {
        max-width: 760px;
        min-width: 760px;
        width: 100%;
        padding-bottom: 20px;
        border-radius: 10px;	
    }

    .full-card-details .item-content-card .org-chart-regular {
        /* background-color: var(--mm-powder-blue); */
        background-color: rgb(0, 166, 190, 0.7);
        border-radius: 40px;
        height: 190px;
        width: 80px;
        margin: 10px 0;
    }

    .full-card-details .item-content-card {
        border-bottom: 1px solid var(--mm-lighter-grey) !important;
        padding: 0 0 10px;
        margin: 0px 20px 20px 20px;
        border-radius: 0;
    }

    .full-card-details .item-content-card span {
        padding-bottom: 8px !important;
    }

    .full-card-details .item-content-card li:nth-child(2) span:nth-child(3) {
        color: var( --mm-powder-blue-state);
    }

    .full-card-details .item-content-card li img {
        width: 80px;
        height: 80px;
        border-radius: 50%;
    }

    .full-card-details .item-content-card li:first-child {
        max-width: 80px !important;
    }

    .full-card-details .item-content-card li:last-child {
        padding-left: 20px;
        max-width: 440px !important;
    }

    .full-card-details .item-content-card li:nth-child(2) .item-content-details {
        display: flex;
        font-size: 16px;
        padding: 10px 0 0 0 !important;
        min-width: 640px;
    }

    .full-card-details .item-content-card li:nth-child(2) .item-content-details li {
        max-width: 280px !important;
        width: 100%;
        padding: 0 !important;
    }

    .full-card-details .item-content-card li:nth-child(2) .item-content-details li:last-child {
        max-width: 360px !important;
    }

    .full-card-details .item-content-card li:nth-child(2) .item-content-details ul li {
        min-width: 100px !important;
    }

    .full-card-details .item-content-card li:nth-child(2) .item-content-details ul li:nth-child(2) {
        font-weight: 500;
        max-width: 180px;
    }

    .full-card-details .item-content-card li:nth-child(2) .item-content-details ul li .green-circle,
    .full-card-details .item-content-card li:nth-child(2) .item-content-details ul li .red-circle {
        width: 14px;
        height: 14px;
    }

    .full-card-details .item-content-container button {
        position: absolute;
        min-width: 160px;
        height: 30px;
        font-size: 16px;
        right: 20px;
    }

    .full-card-details .item-content-container .flight-risk-low button,
    .full-card-details .item-content-container .flight-risk-med button,
    .drag-n-drop-block full-card-details .item-content-container .flight-risk-high button {
        top: 50px;
        padding: 5px 0 5px 8px;
    }

    .full-card-details .item-content-container .flight-risk-low span,
    .full-card-details .item-content-container .flight-risk-med span,
    .full-card-details .item-content-container .flight-risk-high span {
        width: 24px!important;
        height: 24px!important;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-bottom: 0 !important;
        margin: 1px 2px 0 8px;	
    }

    .full-card-details .item-content-container .flight-risk-low span {
        background-color: var(--mm-green-state);
    }

    .full-card-details .item-content-container .flight-risk-med span {
        background-color: var(--mm-orange-state);
    }

    .full-card-details .item-content-container .flight-risk-high span {
        background-color: var(--mm-red-state);
    }

    .full-card-details .item-content-container .flight-risk-low img,
    .full-card-details .item-content-container .flight-risk-med img,
    .full-card-details .item-content-container .flight-risk-high img {
        width: 15px!important;
        height: 15px!important;
        margin: 0!important;
        border-radius: 0;
    }

    .full-card-details .full-card-qualifications ul li,
    .full-card-details .full-card-experience ul li {
        list-style: disc;
    /*    max-width: 760px;*/
        display: list-item;
        padding: 0;
    }

    .full-card-details .full-card-qualifications,
    .full-card-details .full-card-experience,
    .full-card-details .full-card-development {
        margin-left: 20px;
        margin-right: 20px;
    }

    .full-card-details .full-card-qualifications ul,
    .full-card-details .full-card-experience ul,
    .full-card-details .full-card-development ul {
        display: block;
        padding: 0!important;
    }

    .full-card-details .full-card-qualifications ul li,
    .full-card-details .full-card-experience ul li,
    .full-card-details .full-card-development ul li {
        margin-left: 15px;
    }

    .full-card-details .full-card-qualifications ul li::marker,
    .full-card-details .full-card-experience ul li::marker,
    .full-card-details .full-card-development ul li::marker {
        color: var( --mm-powder-blue-state);
        font-size: 10px;
    }

    .full-card-details .full-card-qualifications ul li ul,
    .full-card-details .full-card-experience ul li ul {
        display: flex;
        justify-content: space-between;
        padding: 0;
    }

    .full-card-details .full-card-qualifications ul li li,
    .full-card-details .full-card-experience ul li li {
        padding: 0 !important;
        margin-left: 0 !important;
        display: inline-block; 
    }

    .full-card-details .full-card-qualifications ul li li:nth-child(1),
    .full-card-details .full-card-experience ul li li:nth-child(1) {
        max-width: 220px;
        width: 100%;
        text-overflow: ellipsis;
        overflow: hidden !important;
        white-space: nowrap;
        display: block;
    }

    .full-card-details .full-card-qualifications ul li li:nth-child(2),
    .full-card-details .full-card-experience ul li li:nth-child(2) {
        max-width: 350px;
        width: 100%;
        text-overflow: ellipsis;
        overflow: hidden !important;
        white-space: nowrap;
        display: block;
    }

    .full-card-details .full-card-development ul {
        display: inline-block;
    }

    .full-card-details .full-card-development ul li {
        list-style: disc;
        float: left;
        margin-right: 30px;
        font-size: 14px;	
        max-width: none;
        display: list-item;
        padding: 0;	
    }


    /* Edit Successor Detail Modals */
    .edit-item-details {
        min-width: 560px;
        width: 100%;
        position: relative;	
    }

    .edit-item-details .ready-now-status .form-container {
        max-width: 240px;	
    }

    .edit-item-details .comments .form-container {
        max-width: 540px;	
    }

    .edit-item-details .mm-row-form form {
        flex-direction: column;
    }

    .edit-item-details label {
        padding-bottom: 10px;
    }

    .edit-item-details button {
        min-width: 200px;
    }


    /* Edit Successor Detail Modals :: Dynamic Dropdown Modification */
    .edit-item-details .mm-dynamic-select {
        min-height: 40px;
        position: relative;
    }

    .edit-item-details .mm-dynamic-select ul li .button {
        min-width: 240px;
        height: 40px!important;
        display: block!important;	
    }

    .edit-item-details .mm-dynamic-select img {
        top: -5px;
        left: -40px;
        max-width: 20px;
        min-width: 20px;
        max-height: 20px!important;
        padding-right: 10px;
    }

    .edit-item-details .mm-dynamic-select ul {
        flex-direction: row!important;
        align-items: center!important;
        background-color: transparent;
        justify-content: center;
    }

    .edit-item-details .mm-dynamic-select ul li {
        max-width: 240px!important;
        width: 100%;
    }

    .edit-item-details .mm-dynamic-select ul li:first-child {
        margin-left: 0!important;
        padding: 0;
        border: 0!important;
    }

    .edit-item-details .mm-dynamic-select ul li:last-child li {
        min-width: 280px;
        max-width: 280px !important;	
    }

    .edit-item-details .mm-dynamic-select .down-arrow .mm-navigation-header .mm-select-element {
        right: auto!important;
        left: 0!important;
        min-width: 240px!important;
        top: 40px;     
        border-radius: 0!important;	
        background-color: var(--mm-white)!important;
        -webkit-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
        -moz-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
        box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);		
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header {
        min-height: 40px;
        max-width: 600px;
        width: 100%;
    }	

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element li {
        position: relative;
        padding: 0;
        display: block;
        max-width: 240px !important;
        min-width: 240px;	
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element li img {
        top: 12px!important;
        left: 10px!important;
        max-width: none!important;
        min-width: auto!important;
        max-height: none!important;
        display: flex!important;
        position: absolute!important;
        right: 20px!important;
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element {
        max-width: 240px;
        background-color: var(--mm-white);
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element a {
        border-bottom: 1px solid var(--mm-steel-grey);
        min-height: 40px!important;
        width: auto;
        padding-left: 40px!important;
        color: var(--mm-default-font-color);		
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element a:hover {
        background-color: var(--mm-light-blue);
        color: var(--mm-default-font-color);
        margin: 0;
        -webkit-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
        -moz-box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
        box-shadow: 0px 3px 6px 0px rgba(65, 65, 65, 0.4);
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-dropdown-button {
        background-color: var(--mm-white);		
        padding: 0 15px 0 15px;
        height: 40px;
        max-height: 40px;
        border-radius: 4px;
        min-width: 240px;
        width: 100%;
        color: var(--mm-default-font-color);
        font-weight: normal !important;	
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-dropdown-button:hover,
    .edit-item-details .mm-dynamic-select .mm-navigation-header .active .mm-dropdown-button {
        background-color: var(--mm-white);
        color: var(--mm-default-font-color);
        border-radius: 4px 4px 0px 0;	
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element li:last-child a,
    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element li:last-child a:hover {
        border-radius: 0!important;
        border-bottom: none;
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-selector-white::before {
        border-top: 13px solid var( --mm-powder-blue-state)!important;
    }

    .edit-item-details .mm-dynamic-select .mm-navigation-header .mm-select-element {
         display: none;
    }

    .edit-item-details .mm-dynamic-select .mm-dropdown:hover .mm-select-element {
        display: block;
        height: auto;
    }

    .edit-item-details .flight-risk .mm-navigation-header .mm-select-element a {
        padding-left: 10px !important;
    }

    /*	===== MODALS END ===	*/

    .blocker {
        z-index: 1050!important;
    }



/*	==============================================

		MODAL LINKED POSITIONS // MODAL GRID
		
   	============================================== */
    
    /* Modal Linked Positions */
    .modal-linked-pos,
    .modal-linked-grid {
        max-width: 1200px!important;
        width: 100%;
    }

    .modal-linked-pos ul {
        margin-left: 20px;
        display: inline-block;
        margin-bottom: 20px;
    }

    .modal-linked-pos li {
        list-style: disc;
        float: left;
        margin-right: 30px;
        font-size: 14px;
    }

    .modal-linked-pos li::marker {
        color: var( --mm-powder-blue-state);
        font-size: 12px;
    }


    /* Modal Grid */
    .modal-linked-grid ul {
        border-radius: 6px;
        border: 1px solid var(--mm-grey);	
    }

    .modal-linked-grid flex-container {
        justify-content: flex-start!important;
        font-size: 14px;
        border-bottom: 1px solid var(--mm-grey);
    }

    .modal-linked-grid flex-item {
        min-height: 20px;
    }

    .modal-linked-grid .mm-grid-header {
        justify-content: flex-start;
    }

    .modal-linked-grid flex-item:first-child {
        justify-content: flex-start;
        min-width: 240px;
        font-weight: 500;
    }



/*	========================================= 

		FILTERS
		
   	========================================= */

	/* Standard Filters */
	.filter_buttons li {
		width: calc(25% - 50px);
		display: inline-flex;
		justify-content: center;
		align-items: center;
		max-width: 250px;
		min-width: auto;
		margin-left: 15px;
		margin-bottom: 15px;
	}

	.filter_buttons li.active {
		background-color: #CCEDF2;
		cursor: pointer;
	}

	.filter_buttons li a {
		text-transform: uppercase;
	}

	.content_lists {
		display: flow-root;
	}

	.content_lists li {
		padding: 8px 12px;
		height: auto;
		background-color: #666;
		color: var(--mm-white);
		line-height: 60px;
		border-bottom: 4px solid var(--mm-powder-blue);
		position: relative;
	}

	.content_lists a {
		display: flex;
		height: auto;
		overflow: hidden;
		align-items: center;
		justify-content: center;
		object-fit: cover;
	}

	.content_lists img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;	
	}

	.content_lists_overlay {
		width: 93%;
		display: inline-block;
		height: auto;
		max-height: 95px;
		min-height: 60px;
		overflow: hidden;
		background-color: var(--mm-white);
		color: var(--mm-default-font-color);
		opacity: .7;
		position: absolute;
		bottom: 0;
		left: 0;
		text-align: center;
		padding: 10px 10px;
		font-size: 16px;
		text-transform: uppercase;
		font-weight: 600;
		line-height: 20px;	
	}


	/* Animated Filter */
	.filter_container {
		margin: 50px auto;
		width: 100%;
		max-width: 1630px;
		padding: 0 15px;
	}

	.filter_button_group {
		margin: 0 -15px;
		display: flex;
		align-items: center;
	}

	.filter_button_group a {
		text-transform: uppercase;
	}

	.filter_button_group a.active {
		background-color: #CCEDF2;
	}

	.category_boxes{
		margin: 0 -15px;
	}

	.category_boxes li {
		background-color: #666;
		padding: 10px 12px;
		position: relative;
	}

	.category_boxes li a {
		text-transform: capitalize;
	}

	.category_boxes figure {
		display: flex;
		height: auto; 
		max-height: 230px; 
		max-width: 260px; 
		width:100%; 
		overflow: hidden;
		align-items: center;
		justify-content: center;
		object-fit: cover;
	}

	.category_boxes figure img{
		object-fit: cover;
		object-position: center;
		width: 100%;
		height: 100%;
	}

	.course_name{
		position: absolute;
		left: 0;
		bottom: 0;
		width: 93%;
		padding:10px;
		margin-bottom: 0;
		color: var(--mm-default-font-color);
		border-bottom: 4px solid var(--mm-powder-blue);
		background-color: var(--mm-white);
		text-align: center;
		font-size: 16px;
		font-weight: 500; 
		max-height: 95px; 
		min-height: 60px;
	}



/*	================================================== 

		SHOW / HIDE CSS ONLY  
		
   	================================================== */


		#show,#content{
			display:none;
		}

		#show~label {
			cursor: pointer;
			color: var(--mm-powder-blue);
		}

		#show:checked~#content{
			display:block;
			margin-top: 10px;
			
		}



/*	================================================== 

		EXTERNAL CSS: FLICKITY.CSS CUSTOMIZATION  
		
   	================================================== */

	.mm-carousel li {
		height: 450px;
		max-height: 450px;
		max-width: 1375px;
	}

	.mm-carousel-overlay {
		width: 97%; 
		display: inline-block; 
		height: auto; 
		max-height: 95px; 
		min-height: 60px; 
		background-color: var(--mm-steel-grey); 
		color: #000;
		opacity: .7; 
		position: absolute; 
		bottom: 0; 
		left: 0;
		padding: 20px;
		max-width: 1375px;
		z-index: 1;
	}

	.mm-carousel-overlay h3 {
		text-transform: uppercase;
		color: var(--mm-powder-blue);
		padding: 0;
		margin: 0;
	}

	.mm-carousel-overlay p {
		font-size: 16px;
		text-transform: uppercase;				
		color: var(--mm-default-font-color);
		padding: 0;
		margin: 0;				
	}

	.mm-carousel-image {
		display: flex;
		align-items: center;
		justify-content: center;	
	}

	.mm-carousel-image img {
		max-width: 840px;
	}

	.gallery {
	  background: #EEE;
	}

	.gallery-cell,
	.gallery-cell a {
	  width: 100%;
	  height: 450px;
	  margin-right: 10px;
	  /* background: #8C8;
	  counter-increment: gallery-cell;*/
	}

	/* cell number */
	.gallery-cell:before {
	  display: block;
	  text-align: center;
	  /* content: counter(gallery-cell);*/
	  line-height: 200px;
	  font-size: 80px;
	  color: white;
	}	

	.flickity-page-dots {
		bottom: 35%;
		display: flex;
		justify-content: center;
	}	

	.flickity-page-dots .dot {
		width: 20px;
		height: 20px;
		background: var(--mm-powder-blue);
		opacity: .5;
		margin: 0 15px!important;
	}	

	.flickity-prev-next-button {
		top: 40%;
	}

	.flickity-prev-next-button .flickity-button-icon {
		width: 26px!important;
		height: 26px!important;
	}	

	.flickity-prev-next-button.next {
		right: 25px;
	}			

	.flickity-button {
		color: var(--mm-powder-blue);
		background: transparent!important;
		min-width: auto;
		max-height: none;
		padding: 0;				
	}	



/*	========================================= 

		TOOLTIP
		
   	========================================= */

	.mm-tooltip {
		position: relative;
		display: inline-block;
	}

	.mm-tooltip img {
		margin-left: 5px;
	}

	.mm-tooltip .mm-tooltiptext {
		visibility: hidden;
		width: 180px;
		background-color: var(--mm-white);
		color: var(--mm-default-font-color);			
		text-align: center;
		border-radius: 8px;
		padding: 8px!important;
		height: auto;
		font-size: 14px;
		border:1px solid var(--mm-default-font-color);

		/* Position the tooltip */
		position: absolute;
		z-index: 1;
		font-weight: normal;
		top: 30px;
		left: 0;	
	}

	.mm-tooltip-icon .mm-tooltiptext {
		left: -85px;
	}

	.mm-tooltip:hover .mm-tooltiptext {
		visibility: visible;
	}	



/*	========================================= 

		MODAL POP-UP: MORPH 
		
   	========================================= */

	.morph-button {
		/* margin: 0 auto; */
		display: inline-flex;
	}

	/*.morph-button > button {
	 position: relative;
		padding: 0 1em;
		border: none;
		background-color: transparent;
		color: var(--mm-default-font-color); 
		text-transform: uppercase;
		letter-spacing: 1px;
		font-weight: 700;
		line-height: normal;
		overflow: hidden;
		font-family: arial;
		font-size: 16px;
		max-height: none;
		padding-bottom: 10px!important;	
	}*/

	.morph-button.open > button {
		pointer-events: none;
	}

	.morph-content {
		pointer-events: none;
	}

	.morph-button.open .morph-content {
		pointer-events: auto;
	}

	/* Common styles for overlay and modal type (fixed morph) */
	.morph-button-fixed,
	.morph-button-fixed .morph-content {
		width: auto;
		height: auto;
	}

	.morph-button-fixed .morph-content {
		width: auto;
		height: auto;
	}

	.morph-button-fixed > button {
		z-index: 1;
		width: 100%;
		height: 100%;
		-webkit-transition: opacity 0.1s 0.5s;
		transition: opacity 0.1s 0.5s;
		background-color: transparent;
    	display: block;		
	}

	.morph-button-fixed.open > button {
		opacity: 1;
		-webkit-transition: opacity 0.1s;
		transition: opacity 0.1s;
	}

	.morph-button-fixed .morph-content {
		position: fixed;
		z-index: 900;
		opacity: 0;
		-webkit-transition: opacity 0.3s 0.5s, width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s, margin 0.4s 0.1s;
		transition: opacity 0.3s 0.5s, width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s, margin 0.4s 0.1s;
	}

	.morph-button-fixed.open .morph-content {
		opacity: 1;
	}

	.morph-button-fixed .morph-content > div {
		visibility: hidden;
		height: 0;
		opacity: 0;
		-webkit-transition: opacity 0.1s, visibility 0s 0.1s, height 0s 0.1s;
		transition: opacity 0.1s, visibility 0s 0.1s, height 0s 0.1s;
		background-color: var(--mm-white);
	}

	.morph-button-fixed.open .morph-content > div {
		visibility: visible;
		height: auto;
		opacity: 1;
		-webkit-transition: opacity 0.3s 0.5s;
		transition: opacity 0.3s 0.5s;
	}

/*
	.morph-button-fixed.active > button {
		z-index: 2000;
	}
*/

	.morph-button-fixed.active .morph-content {
		z-index: 1900;
	}

	/* Morph Button Style: Modal */
	.morph-button-modal::before {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 800;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
		content: '';
		opacity: 0;
		-webkit-transition: opacity 0.5s;
		transition: opacity 0.5s;
		pointer-events: none;
	}

	.morph-button-modal.open::before {
		opacity: 1;
		pointer-events: auto;
	}

	.morph-button-modal.active::before {
		z-index: 1800;
		opacity: 0.8!important;
	}

	.morph-button-modal .morph-content {
		overflow: hidden;
		-webkit-transition: opacity 0.3s 0.5s, width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s, margin 0.4s 0.1s;
		transition: opacity 0.3s 0.5s, width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s, margin 0.4s 0.1s;
	}

	.morph-button-modal.open .morph-content {
		top: 50% !important;
		left: 50% !important;
		margin: -150px 0 0 -200px;
		width: 400px;
		height: 150px;
		-webkit-transition: width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s, margin 0.4s 0.1s;
		transition: width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s, margin 0.4s 0.1s;
	}

	.morph-button-modal.active .morph-content	{
		text-align: center;	
	}			

	/* Colors and sizes for individual modals */
	/*.morph-button.morph-button-modal {
	
		display: inline-block;
		margin: 0 10px;
	
	}*/

	.morph-button-modal > button,
	.morph-button-modal .morph-content {
	/*	background-color: var(--mm-white);
		border: 1px solid var(--mm-powder-blue);
		border-radius: 8px; 
		padding-top: 10px; */
		cursor: pointer;
	}

	.morph-button-modal::before {
		background: var(--mm-default-font-color);
	}

	.morph-button-modal.open .morph-content {
		margin: -150px 0 0 -200px;
		width: auto;
		height: auto;
		padding-top: 0;
	}

	.morph-button-modal.open .morph-content > div {
		-webkit-transition: opacity 0.3s 0.3s;
		transition: opacity 0.3s 0.3s;
	}


	/* Let's add some nice easing for all cases */
	.morph-button .morph-content,
	.morph-button.open .morph-content {
		-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
		transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	}

	/* Helper classes */
	.noscroll {
		overflow: hidden;
	}

	.morph-button-overlay.scroll .morph-content {
		overflow-y: scroll;
	}

	.morph-button-sidebar.scroll .morph-content {
		overflow: auto;
	}

	/* No JS fallback: let's hide the button and show the content */
	.no-js .morph-button > button {
		display: none;
	}

	.no-js .morph-button {
		margin: 10px 0;
		float: none;
	}

	.no-js .morph-button,
	.no-js .morph-button .morph-content,
	.no-js .morph-button .morph-content > div {
		position: relative;
		width: auto;
		height: auto;
		opacity: 1;
		visibility: visible;
		top: auto;
		left: auto;
		-webkit-transform: none;
		transform: none;
		pointer-events: auto;
	}

	.no-js .morph-button .morph-content .icon-close {
		display: none;
	}

	.no-js .morph-button-sidebar {
		width: 300px;
		position: fixed;
		top: 0;
		left: 0;
		margin: 0;
		height: 100%;
		background: #e85657;
		overflow: auto;
	}

	.no-transition {
		-webkit-transition: none !important;
		transition: none !important;
	}

	.morphing-content-blocks {
		text-align: center;	
/*		margin-top: 50px;*/
	}

	.morph-button-modal.active .morph-content .icon-filler {
		margin: 40px 15px;
		text-align: center;
		display: inline-block;
		line-height: normal;
    	font-size: 14px;
	}		


	/* Additional Styling */
	.icon-filler {
		width: 50px; 
		height: 50px; 
		border: 1px solid var(--mm-powder-blue); 
		border-radius: 4px; 
		display: inline-flex;
		justify-content: left;
    	margin: 0 15px;		
	}	

	.icon-filler a {
		color: var(--mm-default-font-color);
		font-size: 12px;
		font-family: arial;
		text-decoration: none;
		font-weight: normal;
	}

	.icon-close {
		position: absolute;
		top: 12.5px;
		right: 12.5px;		
		font-family: arial;
		font-size: 16px;
		padding: 3px 9px 5px;
		font-weight: normal;
		font-family: var(--mm-font-stack);
		display: block;
		width: 30px;
		height: 30px;
		text-indent: -9999px;
		content: url(../images/icon-close-delete-square.png);	
	}			


	/* MEDIA QUERIES */
	@media screen and (max-width: 576px) {
		.morph-button.morph-button-modal {
			margin-top: 20px;
		}	
		.morph-button-modal.open .morph-content {
			top: 0% !important;
			left: 0% !important;
			margin: 0;
			width: 100%;
			height: 100%;
			overflow-y: scroll;
			-webkit-transition: width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s;
			transition: width 0.4s 0.1s, height 0.4s 0.1s, top 0.4s 0.1s, left 0.4s 0.1s;
		}
	}



/*	========================================= 

		MODAL POP-UP: DEFAULT
		
   	========================================= */

	.blocker {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow: auto;
		z-index: 1;
		padding: 20px;
		box-sizing: border-box;
		/* background-color: var(--mm-default-font-color); */
		background-color: rgba(65,65,65,0.8);
		text-align: center
	}

	.blocker:before {
		content: "";
		display: inline-block;
		height: 100%;
		vertical-align: middle;
		margin-right: -0.05em
	}

	.blocker.behind {
		background-color: transparent
	}

	.modal {
		display: none;
		vertical-align: middle;
		position: relative;
		z-index: 2;
		max-width: 500px;
		box-sizing: border-box;
		width: 90%;
		background: var(--mm-white);
		padding: 15px 30px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		-o-border-radius: 8px;
		-ms-border-radius: 8px;
		border-radius: 8px;
		-webkit-box-shadow: 0 0 10px #000;
		-moz-box-shadow: 0 0 10px #000;
		-o-box-shadow: 0 0 10px #000;
		-ms-box-shadow: 0 0 10px #000;
		box-shadow: 0 0 10px #000;
		text-align: left;
		animation-name: animatetop;
		animation-duration: 1s;	
	}

	.modal a.close-modal {
		position: absolute;
		top: 12.5px;
		right: 12.5px;
		display: block;
		width: 30px;
		height: 30px;
		text-indent: -9999px;
		/* background-size: contain; */
		/* background-repeat: no-repeat; */
		/* background-position: center center; */
		content: url(../images/icon-close-delete-square.png);
		/*		background-image:	url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==');*/
	}

	.modal-spinner {
		display: none;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translateY(-50%) translateX(-50%);
		padding: 12px 16px;
		border-radius: 5px;
		background-color: #111;
		height: 20px
	}

	.modal-spinner>div {
		border-radius: 100px;
		background-color: var(--mm-white);
		height: 20px;
		width: 2px;
		margin: 0 1px;
		display: inline-block;
		-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
		animation: sk-stretchdelay 1.2s infinite ease-in-out
	}

	.modal-spinner .rect2 {
		-webkit-animation-delay: -1.1s;
		animation-delay: -1.1s
	}

	.modal-spinner .rect3 {
		-webkit-animation-delay: -1.0s;
		animation-delay: -1.0s
	}

	.modal-spinner .rect4 {
		-webkit-animation-delay: -0.9s;
		animation-delay: -0.9s
	}

	@-webkit-keyframes sk-stretchdelay {
		0%, 40%, 100% {
		-webkit-transform:scaleY(0.5)
		}
		20% {
		-webkit-transform:scaleY(1.0)
		}
	}

	@keyframes sk-stretchdelay {
		0%, 40%, 100% {
		transform:scaleY(0.5);
		-webkit-transform:scaleY(0.5)
		}
		20% {
		transform:scaleY(1.0);
		-webkit-transform:scaleY(1.0)
		}
	}



/*	==================================== 

		CUSTOM SCROLLBAR
		
   	==================================== */

	.mm-custom-scrollbar {
		height: 300px;
		width: 100%;
	}

	.mm-custom-scrollbar p {
		padding-right: 20px;
	}

	.mm-custom-scrollbar .scroll-content {
		padding-bottom: 30px;
	}

	/* Custom Scrollbar Track */
	.scrollbar-track {
		opacity: 1!important;
		background: var(--mm-light-blue)!important;	
		border-radius: 4px;
	}

    .scrollbar-thumb, .scrollbar-track-y {
        width: 8px !important;
    }

	.scrollbar-track-y,
	.scrollbar-thumb-y {
		display: block!important;	
	}

	.scrollbar-thumb-y {
		min-height: 185px;
	}

	.scrollbar-thumb {
		width: 8px!important;
		background: var(--mm-powder-blue)!important;
	}	



/*	============================================ 

		CUSTOM SCROLLBAR :: NO JS REQUIREMENT
		
   	============================================ */

	.mm-simple-scrollbar-w {
		/* customisable */ 
		width: 800px; 
		height: auto; 
		scrollbar-color: var(--mm-powder-blue) var(--mm-light-blue); 
		scrollbar-width: thin;		
	}

	.mm-simple-scrollbar-h {
		/* customisable */ 
		width: auto; 
		height: 300px; 
		scrollbar-color: var(--mm-powder-blue) var(--mm-light-blue); 
		scrollbar-width: thin;		
	}

	.mm-simple-scrollbar-y {
		overflow-y: scroll; 
		overflow-x: hidden;		
	}

	.mm-simple-scrollbar-x {
		overflow-y: hidden; 
		overflow-x: scroll;		
	}

	.mm-simple-scrollbar-w::-webkit-scrollbar-track,
	.mm-simple-scrollbar-h::-webkit-scrollbar-track {
		border-radius: 10px;
		background-color: var(--mm-light-blue);
	}

	.mm-simple-scrollbar-w::-webkit-scrollbar,
	.mm-simple-scrollbar-h::-webkit-scrollbar{
		width: 8px;
		background-color: var(--mm-light-blue);
		height: 8px
	}

	.mm-simple-scrollbar-w::-webkit-scrollbar-thumb,
	.mm-simple-scrollbar-h::-webkit-scrollbar-thumb{
		border-radius: 10px;
		background-color: var(--mm-powder-blue);
	}



/*	==================================== 

		STICKY NAVIGATION
		
   	==================================== */
	.mm-sticky-nav {
	  position: fixed;
	  width: 205px;
	  top: 0;	
	  padding-top: 10px;	
	}



/*	=========================================== 

		HAMBURGER MENU || EXPANDED DROPDOWN
		
   	=========================================== */
	#menu-toggle {
	  display: none;
	}



/*	==================================== 

		MEDIA QUERIES
		
   	==================================== */

	/* MAX-WIDTH: 1600px */
	@media screen and (max-width: 1600px){
		.filter_button_group {
			margin: 0 -15px;
			display: flex;
			align-items: center;
		}
		
		.category_boxes {
			margin: 0 -15px;
		}
		
		
		/* Updated User Info Subheader */
		.updated-user-info-sub li:first-child {
		   margin-left: 13%;		
		}
	}


	/* MIN-WIDTH: 1024px AND MAX-WIDTH: 1366px */
	@media screen and (min-width: 1024px) and (max-width: 1366px) {
		
		/* Navigation Blue */		
		.mm-orange-block {
			position: revert;
		}
		
		
		/* Updated User Info */
		.user-info-centered li:first-child,
		.user-info-centered li:last-child {
			width: 100%;
			transition: .5s all ease;		
		}	
		
		
		/* Updated User Info Subheader */
		.updated-user-info-sub li:first-child {
		   margin-left: 14%;		
		}		
		
		
		/* Content Display Lists Form Layout */		
		.content_display_lists__block .form_layout {
			max-width: 60%;	
    		justify-content: space-between;			
		}		 
	}


	/* MAX-WIDTH: 1200px */
	@media screen and (max-width: 1200px) {
	
		/* Responsive Displays */
		.responsive-display-block {
			display: block;
		}

		.responsive-display-none {
			display: none;
		}
		
		
		/* Category Boxes */
		.category_boxes li {
			width: calc(25% - 50px)
		}
		
		
		/* User Info */
		.mm-dropdown-content {
			width: 99.8%;			
		}
				
		.mm-dropdown, .mm-dropdown-button {
			min-width: 300px!important;
			width: 100%;
		}
		
		.mm-dropdown {
			margin-bottom: 10px;
		}
		
		.mm-user-info li {
			width: 100%;
			margin-left: 10px;
		}		
		
		.mm-user-info li:first-child {
			margin-left: 10%;
		}
		
		
		/* Navigation Blue */
		.mm-navigation-header {
			display: block;
			width: 100%;
		}
		
		.mm-navigation-header li {
			border-right: 0;
			margin-bottom: 0;
			width: auto;
			/*border-bottom: 1px solid var( --mm-powder-blue-state);*/
			max-width: none;	
			min-height: 43px;
		}
		
		.mm-navigation-header .mm-select-element {
			width: 100%;
		}
		
		.mm-navigation-header .mm-select-element a:hover {
			margin: 0;
			width: 100%;
		}
		
		.header-home__icon_placement {
			padding: 10px;
			justify-content: flex-start;
		}
		
		.header-nav__page_title	{
			display: flex!important;
			padding: 0 15px 0 15px;
			height: 60px;
			max-height: 60px;
		}
		
		.mm-orange-block {
			position: revert;
		}
		
		
		/* Search */		
		.search.collapsed {
			width: 2em;
		}

		.search.collapsed input {
			width: 0;
		}

		.search a {
			position: absolute;
			right: 82px;
			top: 15px;	
			cursor: pointer;
		}
		
		.search.collapsed span {
			color: var(--mm-white);
			border-radius: 4px;
		}

		.search.collapsed span:hover {
			color: var(--mm-white);
		}		

		
		/* User Extended Info */
		.user-info-extended ul {
			height: auto;
		}
		
		.user-info-extended li {
			max-width: 100%;
			height: auto;
		}
		
		
		/* Updated User Info */
		.updated-user-info li:first-child {
			margin-left: 10%;
		}
		
		.updated-user-info h3 {
			margin-top: 30px!important;
		}

		.updated-user-info .user-info-button {
			justify-content: normal;
			width: 100%;
			margin-right: 15px;
			position: unset;
			right: 0;
			max-width: 100%;
		}

		.updated-user-info li,
		.updated-user-info-sub li {
			max-width: 100%;		
		}			

		.updated-user-info .user-info-button {
			margin-top: 10px;
		}
		
		
		/* Updated User Info Subheader */
		.updated-user-info-sub li:first-child {
		   margin-left: 15%;		
		}		
		
		
		/* Form Layout */	
		.form_layout {
			display: flex;
			justify-content: space-evenly;	
		}	

		.form_layout li:first-child	{
			justify-content: flex-end;		
		}	
		
		
		/* Content Display Lists Form Layout */		
		.content_display_lists__block .form_layout {
			max-width: 60%;		
    		justify-content: space-between;			
		}
		
		
		/* Secondary Header */
		.secondary-header {
			display: block;
		}

		.secondary-header li {
			width: auto;
			justify-content: flex-start;
			max-width: none!important;
			border-right: none;
			border-top: 1px solid var( --mm-powder-blue-state);
		}
		
		.secondary-header li:first-child {
			padding-left: 15px;
			border-top: none;
		}	
		
		
		/* Hamburger Navigation Header */
		.humanhub_nav_wrapper_landing .mm-navigation-header {
			display: flex;
			width: auto;
		}		
	}



	/* MAX-WIDTH: 992px */
	@media screen and (max-width: 992px) {

/*
.humanhub_header {
       max-height: none !important; 
    }
*/	
		/* Mobile Displays */
		.mobile-display-block {
			display: block;
		}

		.mobile-display-none {
			display: none;
		}
		
		
		/* Human Hub Header */
/*
		.humanhub_header {
			max-height: none!important;
		}

*/
		.humanhub_header li:first-child,
		.humanhub_header li:last-child{
			min-width: auto!important;
		}	
		
		
		/* Carousel */
		.gallery-cell, 
		.gallery-cell a {		
			height: auto;
		}
		
		.mm-carousel-overlay{
			width: 98%;
			min-height: 30px;
			padding: 5px;
		}
			
		
		/* Responsive Button */		
		.button-container-responsive li {
			text-align: center;
			display: inline-block;
			width: 100%;
		}
		
		.button-container-responsive button {
			margin-bottom: 10px;
			display: flex;
			margin-left: auto;
			margin-right: auto;
		}		
		
		
		/* Filter Button Group */
		.filter_button_group {
			display: block;
		}
		
		.filter_button_group li { 
			width: calc(45% - 32px)!important;
			min-width: auto;			
		}
		
		.filter_buttons li {
			width: calc(45% - 30px);
			max-width: none;
		}
		
		
		/* Tabbed Content */
		ul.tabs {
			display: none!important;
		}			
		
		.tab_content {
			margin-top: 0!important;
			padding-top: 0;
		}
		
		.tab_drawer_heading {
			background-color: var(--mm-grey);
			color: var(--mm-default-font-color);
			border-top: 1px solid var(--mm-powder-blue);
			margin: 0;
			padding: 5px 20px;
			display: block;
			cursor: pointer;
			font-size: 20px;
			font-weight: 600;
			text-align: center;		
			-webkit-touch-callout: none;
			-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
			height: 60px;
			line-height: 60px;			
		}
		
		.tab_drawer_heading img {
			filter: invert(43%) sepia(1%) saturate(0%) hue-rotate(112deg) brightness(88%) contrast(86%);
			margin: 10px 0;
		}

		.tab_drawer_heading:hover img,
		.d_active.tab_drawer_heading img {
			filter: none;
		}	
				
		.tab_drawer_heading:hover,
		.d_active {
			background-color: var(--mm-white);
			color: var(--mm-powder-blue);	
			font-size: 20px;
			font-weight: 600;
			text-align: center;	
		}	
		
		
		/* User Info */
		.mm-user-info {
			max-height: none;
			width: 100%;
			display: inline-table;
			height: auto;
		}	
		
		.mm-user-info ul {
			height: auto;
			display: block;
		}
		
		.mm-user-info li {			
			align-items: flex-start;
			flex-direction: column;
			margin-left: 15%!important;
			margin-bottom: 10px;
			margin-top: 10px;
			width: auto;
		}
		
		
		/* Updated User Info Image */
		.updated-user-info li:first-child {
			margin-left: 12%;
			transition: .5s all ease;
		}
		
		.user-info-centered img	{
			width: 100%;
		}		
		
		
		/* User Info Extended */
		.user-info-extended ul {
			display: inline-block;	
		}

		.user-info-extended li {
			padding: 0;
			justify-content: inherit!important;
		    max-height: 45px;
		}
		
		.user-info-extended .divider {
			display: none!important;
		}
		
		
		/* Updated User Info Subheader */
		.updated-user-info-sub li:first-child {
		   margin-left: 19%;		
		}
		
		.updated-user-info-sub .mm-sub-manager img {
		   margin-left: 5%;		
		}		
		
		
		/* Card Lists */
		.mm-card_lists--header h2 {	
			font-size: 20px;	
		}

		
		/* IE Browser Notice */
		.browser_notice {
			padding: 10px 20px;
			font-size: 14px;
		}	
		
		
		/* Form Layout */			
		.form_layout {
			width: auto;
			display: inline-block;
		}		

		.form_layout li {
			width: 100%;
			margin: 0!important;
			justify-content: initial!important;
		}	
		
		
		/* Content Display Lists Form Layout */		
		.content_display_lists__block .form_layout {
			max-width: 50%;
			display: block;	
			padding: 30px 0 0 0!important;
		}
		
		.content_display_lists__block .form_layout li {		
			display: inline-block;
		}
		
		.content_display_lists__block .form_layout .mm-row-form {
			max-width: none;
		}
		
		
		/* Medical Aid Lists */
		.mm-option-header-lists ul {
			flex-direction: column;	
		}

		.mm-option-header-lists .options {
			max-width: none;
			width: 100%;
			margin-top: 20px;
		}	

		.mm-option-header-lists .options li span {
			padding: 0 10px;
		}	

	/* Hamburger Menu -- Start */
	
		.humanhub_menu .mm-navigation-header {
			display: flex;
			max-height: none;
			min-height: auto;
            /*margin-top: 90px;*/
		}

.humanhub_menu .mm-navigation-header .humanhub_home {
        margin: 5px 0;
    }

		.menu-button,
		.menu-button::before,
		.menu-button::after {
			display: block;
			background-color: var(--mm-white);
			position: absolute;
			height: 2px;
			width: 30px;
			transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1);
			border-radius: 2px;
		}

		.menu-button::before {
			content: "";
			margin-top: -8px;
		}

		.menu-button::after {
			content: "";
			margin-top: 8px;
		}

		#menu-toggle:checked + .menu-button-container .menu-button::before {
			margin-top: 0px;
			transform: rotate(405deg);
		}

		#menu-toggle:checked + .menu-button-container .menu-button {
			background: rgba(255, 255, 255, 0);
		}

		#menu-toggle:checked + .menu-button-container .menu-button::after {
			margin-top: 0px;
			transform: rotate(-405deg);
		}	

		.menu-button-container {
			display: flex;
			justify-content: flex-start;
			position: absolute;
			left: 15px;
			width: 30px;
			height: 44px;
			align-items: center;
			cursor: pointer;
		}

		.menu {
			position: absolute;
			z-index: 5;
			top: 44px;
			margin-top: 90px;
			left: 0;
			flex-direction: column;
			width: 100%;
			justify-content: center;
			align-items: center;
		}

		#menu-toggle ~ .menu li {
			height: 0;
			margin: 0;
			padding: 0;
			border: 0;
			transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
			display: none;
		}

		#menu-toggle:checked ~ .menu li {
			border: 1px solid var(--mm-white);
			height: auto;
			padding: 0;
			transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
			display: block;  
			background-color: var(--mm-scarlet-red);
		}

		.menu > li {
			width: 100%;
		}

		.menu > li:not(:last-child) {
			border-bottom: 1px solid #444;
		}

		.menu .active {
			height: auto;
			flex-direction: column;
		} 

#menu-toggle:checked ~ .menu li:nth-child(n+1) {
        border-bottom: 1px solid var(--mm-powder-blue);
        border-radius: 0 !important
    }

		.mm-select-element {
			position: absolute;
		}

		.humanhub_menu .mm-navigation-header .mm-dropdown-button {
			max-height: none!important;
			height: auto!important;
		}

		.mm-navigation-header {
			background-color: transparent;
		}	

		.mm-selector-white::before {
			top: 13px;
			bottom: auto;
		}	

		.humanhub_menu .mm-navigation-header .mm-select-element, 
		.humanhub_menu .mm-navigation-header .mm-select-element li:last-child a, 
		.humanhub_menu .mm-navigation-header .mm-select-element li:last-child a:hover {
			border-radius: 0!important;
		}	
		
		.humanhub_nav_wrapper_landing .mm-navigation-header {
			width: 100%;
		}		
        
        /* Mobile Menu Dropdown */
/*
        .mm-select-element {
            display: none!important;
        }
*/

        .mm-dropdown.mobile .mm-select-element {
            display: block!important;
        }

        .mm-navigation-header .mm-selector-white::before {
            transform: rotate(0deg) translateY(0px);
            transition: transform .2s linear;
        }

        .mm-navigation-header .mm-selector-white.mobile::before {
            transform: rotate(180deg) translateX(-3px);
        } 
        
		/* END -- Hamburger Menu */	
	}



	/* MAX-WIDTH: 767px */
	@media screen and (max-width: 767px) {
		
		/* Standard Filters */
		.filter_buttons li,
		.filter_button_group li {
			width: 100%!important;
			max-width: none;
		}

		.content_lists_overlay {
			min-height: 30px;
		}
		

		/* Animated Filters */
		.filter_container {
			padding: 0;
		}
		
		.filter_button_group {
			margin: 0;
		}
		
		.filter_button_group,
		.category_boxes {
			margin: 0 15px;
		}
		
		.category_boxes li {
			width: 100%;
		}	
		

		/* Dropdown */
		.mm-dropdown-content {
			width: 99.7%;
		}	
		
		
		/* User Info */
		.mm-user-info li {
			margin-left: 20%!important;		
		}	
		
		
		/* Updated User Info Image // Updated User Info Subheader Image  */
		.updated-user-info h3 {
			font-size: 14px;
			transition: .5s all ease;
			margin-top: 10px!important;
		}

		.updated-user-info img {
			max-width: 100px;
			transition: .5s all ease;
		}	
		
		.updated-user-info-sub img {
			max-width: 150px;
			transition: .5s all ease;
		}	
		
		.updated-user-info ul {
			display: inline-block;		
			margin-top: 85px;
			margin-left: 15px;
			padding-bottom: 20px;
			line-height: 22px;
		}
		
		.updated-user-info-sub ul {
			display: inline-block;		
			margin-top: 125px;
			margin-left: 15px;
			padding-bottom: 20px;
			line-height: 22px;
		}
		
		.updated-user-info-sub ul li ul {
			margin-top: 15px;
			margin-left: 0;
		}
		
		.updated-user-info-sub .mm-sub-employee ul {
			padding-bottom: 0;
		}	
		
		.updated-user-info-sub .mm-sub-employee ul li, 
		.updated-user-info-sub .mm-sub-manager ul li {
			min-height: auto;			
		}
		
		.updated-user-info-sub .mm-sub-employee h3 {
			font-size: 16px;
		}			

		.updated-user-info li,
		.updated-user-info-sub li {
			max-width: 100%;
			text-align: left;
		}	

		.updated-user-info li:first-child,
		.updated-user-info-sub li:first-child {
			margin-left: 0;
			transition: none;
		}

		.updated-user-info li:nth-child(1) span:last-child,
		.updated-user-info li:nth-child(2) span:last-child	{
			display: none;
		}	

		.updated-user-info li:last-child {
			position: relative;
			justify-content: flex-start;
		}		

		.user-info-centered h3 {
			font-size: 14px;
		}		

		.divider {
			display: none!important;
		}		
		
	
		/* Sliders */
		.mm-slider label.checkbox-toggle-label::before {
			width: 54px;
			height: 24px;
		}

		.mm-slider label.checkbox-toggle-label::after {
			left: 2px;
			top: 3px;
			width: 20px;
			height: 20px;	
		}	
		
		
		/* Card Lists */		
		.mm-card_lists{
			display: block;	
			width: auto;
		}

		.mm-card_lists li {
			max-width: none;	
			min-height: 175px;
			margin-bottom: 40px;
		}

		.mm-card_lists li .mm-card_lists--header {
			text-align: left;
		}		
		

		/* Form Layout */
		.form_layout {
			flex-direction: column;
		}		
				
		
		/* Pagination */
		.mm-pagination-container {
			display: block;
			text-align: center;
			width: 100%;
			margin: 30px auto 15px;
			max-width: 330px;
		}
		.mm-pagination-block {
			margin: 0!important;
		}
		
		
		/* Medical Aid Lists */	
		.mm-option-header-lists flex-container {
			display: inline-block;
			border: 0;
			width: 100%;
			text-align: left;	
			padding: 5px 10px;	
		}

		.mm-option-header-lists flex-item {
			font-size: 14px;
			display: block;
			width: auto!important;
			text-align: left;		
		}	
		 .humanhub_header li h2{
		display:none;
		}
		
		/* Hamburger Menu -- Start */
	
		.humanhub_menu .mm-navigation-header {
			display: flex;
			max-height: none;
			min-height: auto;
            /*margin-top: 90px;*/
		}

.humanhub_menu .mm-navigation-header .humanhub_home {
        margin: 5px 0;
    }

		.menu-button,
		.menu-button::before,
		.menu-button::after {
			display: block;
			background-color: var(--mm-white);
			position: absolute;
			height: 2px;
			width: 30px;
			transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1);
			border-radius: 2px;
		}

		.menu-button::before {
			content: "";
			margin-top: -8px;
		}

		.menu-button::after {
			content: "";
			margin-top: 8px;
		}

		#menu-toggle:checked + .menu-button-container .menu-button::before {
			margin-top: 0px;
			transform: rotate(405deg);
		}

		#menu-toggle:checked + .menu-button-container .menu-button {
			background: rgba(255, 255, 255, 0);
		}

		#menu-toggle:checked + .menu-button-container .menu-button::after {
			margin-top: 0px;
			transform: rotate(-405deg);
		}	

		.menu-button-container {
			display: flex;
			justify-content: flex-start;
			position: absolute;
			left: 15px;
			width: 30px;
			height: 44px;
			align-items: center;
			cursor: pointer;
		}

		.menu {
			position: absolute;
			z-index: 5;
			top: 44px;
			margin-top: 90px;
			left: 0;
			flex-direction: column;
			width: 100%;
			justify-content: center;
			align-items: center;
		}

		#menu-toggle ~ .menu li {
			height: 0;
			margin: 0;
			padding: 0;
			border: 0;
			transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
			display: none;
		}

		#menu-toggle:checked ~ .menu li {
			border: 1px solid var(--mm-white);
			height: auto;
			padding: 0;
			transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
			display: block;  
			background-color: var(--mm-scarlet-red);
		}

		.menu > li {
			width: 100%;
		}

		.menu > li:not(:last-child) {
			border-bottom: 1px solid #444;
		}

		.menu .active {
			height: auto;
			flex-direction: column;
		} 

#menu-toggle:checked ~ .menu li:nth-child(n+1) {
        border-bottom: 1px solid var(--mm-powder-blue);
        border-radius: 0 !important
    }

		.mm-select-element {
			position: absolute;
		}

		.humanhub_menu .mm-navigation-header .mm-dropdown-button {
			max-height: none!important;
			height: auto!important;
		}

		.mm-navigation-header {
			background-color: transparent;
		}	

		.mm-selector-white::before {
			top: 13px;
			bottom: auto;
		}	

		.humanhub_menu .mm-navigation-header .mm-select-element, 
		.humanhub_menu .mm-navigation-header .mm-select-element li:last-child a, 
		.humanhub_menu .mm-navigation-header .mm-select-element li:last-child a:hover {
			border-radius: 0!important;
		}	
		
		.humanhub_nav_wrapper_landing .mm-navigation-header {
			width: 100%;
		}		
        
        /* Mobile Menu Dropdown */
/*
        .mm-select-element {
            display: none!important;
        }
*/

        .mm-dropdown.mobile .mm-select-element {
            display: block!important;
        }

        .mm-navigation-header .mm-selector-white::before {
            transform: rotate(0deg) translateY(0px);
            transition: transform .2s linear;
        }

        .mm-navigation-header .mm-selector-white.mobile::before {
            transform: rotate(180deg) translateX(-3px);
        } 
        
		/* END -- Hamburger Menu */		
		
		
		/* PS Navigation Header */
		.mm_ps_header li:nth-child(2) .mm-row-form .form-container {
			min-width: 300px;
			max-width: 340px;
		}	
		
		.mm_ps_header ul {
			justify-content: center;
			align-items: center;
			display: flex;
			flex-direction: column;			
		}
		
		.mm_ps_header ul ul {
			flex-direction: row;
			justify-content: space-between;
		}
	}



	/* MAX-WIDTH: 600px */
	@media screen and (max-width: 600px) {
		
		/* User Info */
		.mm-user-info li {
			margin-left: 22%!important;
		}		
	}



	/* MAX-WIDTH: 480px */
	@media screen and (max-width: 480px) {
		
		/* Dropdown Content */
		.mm-dropdown-content {
			width: 99.5%;
		}
	}



	/* MIN-WIDTH: 320px and MAX-WIDTH: 480px :: ORIENTATION and LANDSCAPE for SMARTPHONES */
	@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
		
		/* User Info */
		.mm-user-info li {
			margin-left: 35%!important;
		}
	}



/* 	========================================

		CUSTOMISED PEOPLESOFT CSS CODE 

	======================================== */


/* Custom PS Modal Buttons */
.ps_box-msgactions .ps-button {
	border: 2px solid var(--mm-powder-blue)!important;
	border-radius: 20px!important;
}

.psc_attach-clear .ps-button,
.psc_attach-upload .ps-button {
	border: 2px solid var(--mm-powder-blue)!important;
	color: var(--mm-powder-blue)!important;	
}

.ps_box-msgactions .ps-button:hover, 
.ps_box-msgactions .ps-button:link:hover,
.psc_attach-clear .ps-button:hover,
.psc_attach-clear .ps-button:link:hover,
.psc_attach-upload .ps-button:hover,
.psc_attach-upload .ps-button:link:hover,
.psc_modal-done .ps-button:hover, 
.psc_modal-done .ps-button:link:hover {
	background-color: #CCEDF2!important;
    color: var(--mm-powder-blue)!important;
    border: 2px solid var(--mm-powder-blue) !important;
}

.psc_modal-done .ps-button {
    border: 2px solid var(--mm-powder-blue) !important;
    background: var(--mm-white) !important;
	color: var(--mm-powder-blue)!important;
}


/* Custom PS Toggle Switch */
/*
.ps_switch .psc_on_container:before {
    content: "Yes";
	color: #000;
}

.ps_switch .psc_off_container:before {
    content: "No";
	color: #000;
}
*/


/* ===== Peoplesoft Specific Code ===== */

/* When Sliders Are Disabled */
/*
.ps_switch.psc_disabled .psc_off_container:before {
    content: "No";
    color: #000;
    margin-left: -6em;
    top: auto !important;
}

.ps_switch.psc_disabled .psc_on_container:before {
    content: "Yes";
    color: #000;
    margin-left: -3em !important;
}
*/

/* When Sliders Are Enabled */
/*
.ps_switch .psc_off_container:before {
    content: "No";
    color: #000;
    margin-left: 6em;
    top: -27px;
    position: relative;
}

.ps_switch .psc_on_container:before {
    content: "Yes";
    color: #000;
    margin-left: -3em;
}
*/

 
.ps_switch .psc_on_container, 
.ps_switch .psc_off_container {
/*	width: 3.9em!important; */
    display: inline-block;
    text-align: center;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    -webkit-transition: -webkit-transform 0.125s ease-in-out;
    -moz-transition: -moz-transform 0.125s ease-in-out;
    -ms-transition: -ms-transform 0.125s ease-in-out;
    transition: transform 0.125s ease-in-out;
    position: relative;
    line-height: 1.25em;
    background: transparent !important;
    font-weight: normal;
    color: #000 !important;
	min-width: auto!important;
    box-shadow: none !important;    
}
 
.ps_switch .psc_on_container:after {
    width: 1.5em !important;
    height: 1.5em !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    box-shadow: none !important;
    background-image: none !important;
    background: var(--mm-green);
    border: 0 !important;
    margin-top: -1px!important;
    right: 1.35em!important;
	content: "" !important; 
}


/* 	========================================

				--	END  -- 

	======================================== */



/*[id*="hdrdivPT_TITLE_CONT1"]{
 min-height:0px!important;
 border-bottom: 0!important;

}
*/
	


/*
div#win0hdrdivPT_TITLE_CONT1 {
	min-height: auto;
}
*/

a.mp_header_href,
a.mp_header_href:hover{
    background-color: transparent !important;
	text-transform: capitalize;
}

/*
a.ps-button, a.ps-button:link, a.ps-button:hover, a.ps-button:link:hover {  
    background-color: transparent !important;
}
*/


.psc_error input, .psc_error select, .psc_error textarea {
    background-image: none !important;
    background-color: var(--mm-red) !important;
    color: #ffffff !important;
    background-color: var(--mm-red) !important;
    color: var(--pt-control-error-text-color) !important;
    border-color: var(--pt-control-error-border-color) !important;
    outline-offset: 1px;
}


img[src*='PT_ORACLELOGO'],
img[src*="PTNUI_DEFAULT_ICN"]{
display: none !important;
}