/*
Theme Name: UM Theme Child
Theme URI: https://ultimatemember.com/theme/
Template: um-theme
Author: Ultimate Member
Author URI: https://ultimatemember.com/
Description: UM Theme is an intuitive &amp; flexible, WordPress theme offering deep integration with Ultimate Member.
Tags: one-column,two-columns,right-sidebar,flexible-header,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,featured-images,theme-options,post-formats,footer-widgets,rtl-language-support
Version: 1.193
Updated: 2025-09-20 14:13:25

*/

/**
 * UM Avatar
 */
.um-avatar {
	border-radius: 360px !important;
}
/**
 * UM Theme issues fixes
 */
.boot-row {
	margin: 0px !important;
}

.boot-row .boot-col-md-12 {
	padding: 0px !important;
}


/** 
* Buttons 
*/

#vanl-button-disabled .elementor-button{
    opacity: 0.2 !important;
	background:  #181818 !important;
}

.um-button-default-accent-green,
.um-button {
	display: block;
	flex: 1 0 0 !important;
	border-radius: 350px !important;
	background: var(--accent-green, #10B981) !important;
	width: 100% !important;
	padding: 8px 20px !important;
	text-align: center !important;
	color: #FFF !important;
	font-family: Poppins !important;
	font-size: 14px !important;
	font-style: normal !important;
	font-weight: 500 !important;
	line-height: normal !important;
}
.um-button-default-accent-green:hover,
.um-button:hover,
.um-modal-btn:hover, .um input[type=submit].um-button:hover, .um a.um-button:hover, .um-button:active {
	color: #FFF !important;
}

.um-login .um-button:hover {
	background-color: #169168 !important;
}

/**
 * Limit logo size
 */
img.attachment-full.size-full.wp-image-6868,
img.attachment-full.size-full.wp-image-6870 {
    max-width: 200px;
}

/**
 * Custom Menu Buttons
 */
 /**
  * White Header
  */
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6920 a::after,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6921 a::after{
	background: transparent;
}

li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6920,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6921{
	border-radius: 350px;
	border: 2px solid #1818181A;
	margin-right: 15px;
	padding: 0px 0px;
	height: 37px;
	margin-top: 10px;
}
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6920:hover,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6921:hover{
	background-color:   #1818181A;
	border: 2px solid #1818181A;
}

li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6920:hover a,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6921:hover a{
	
}

li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6920.current-menu-item ,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6921.current-menu-item {
	background-color:  rgba(255, 255, 255, 0.30);
	color: #181818;
	border: 2px solid rgba(255, 255, 255, 0.30);
}

/**
 * Black Header
 */
#menu-1-4ddf7ff li.menu-item-10255,
#menu-1-4ddf7ff li.menu-item-10256{
	border-radius: 350px;
	border: 2px solid rgba(255, 255, 255, 0.30);
	background: transparent;
	margin-right: 15px;
	padding: 0px 0px;
	height: 37px;
	margin-top: 10px;
}

#menu-1-4ddf7ff li.menu-item-10255:hover,
#menu-1-4ddf7ff li.menu-item-10256:hover{
	background-color:  #FFFFFF1A;
}

li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6920:hover,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-6921:hover,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-10255:hover,
li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-10256:hover
{
	border: 2px solid transparent;
	border-radius: 350px;
}

li.menu-item.menu-item-6920:hover a,
li.menu-item.menu-item-6921:hover a,
li.menu-item.menu-item-10255:hover a,
li.menu-item.menu-item-10256:hover a
{
  text-decoration: none;
  border-bottom: none;
  border-radius: 350px;
}

li.menu-item.menu-item-10255 a::after,
li.menu-item.menu-item-10256 a::after {
  background: transparent !important;
  border-bottom: none !important;
}

/** User Action Menu **/
#menu-1-6df84fb  .sub-arrow {
	display: none !important;
}
#menu-1-6df84fb a::after {
	background: transparent !important;
  	border-bottom: none !important;
}

/** Elementor Nav Menu **/
.elementor-nav-menu__align-start .elementor-nav-menu {
	padding-bottom: 50px;
}

/** Inloggen button icon fix **/

 .vanl-inloggen:hover .vanl-login-menu{
	--vanl-accent: #10B981;
	--vanl-filter: invert(45%) sepia(76%) saturate(749%) hue-rotate(100deg) brightness(95%) contrast(90%);
}

.vanl-inloggen:hover   * {
	color: var(--vanl-accent) !important;
	filter: var(--vanl-filter);
}


/** Popup fix **/
.dialog-widget-content {
	background: transparent !important;
}
.dialog-widget {
	z-index: 999999 !important;
}
/**
Social Login Icons SVG fix
**/
.elementor-element-56a46cd svg {
	width: 100% !important;
}
/** UM Forms, Fields and Buttons **/
.um-form input[type="text"],
.um-form input[type="email"],
.um-form input[type="url"],
.um-form input[type="password"],
.um-form input[type="tel"],
.um-form input[type="number"],
.um-form input[type="search"],
.um-form textarea {
	display: flex;
	min-height: 60px !important;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	margin-bottom: 7px !important;
	flex: 1 0 0;
	border-radius: 8px;
	background: var(--bakground-secondary, #F3F4F6) !important;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25) inset !important;
	border: 2px solid transparent;
}

.um-profile .um-form input[type="text"],
.um-profile .um-form input[type="email"],
.um-profile .um-form input[type="url"],
.um-profile .um-form input[type="password"],
.um-profile .um-form input[type="tel"],
.um-profile .um-form input[type="number"],
.um-profile .um-form input[type="search"],
.um-profile .um-form textarea {
	background:#F3F4F6 !important;
	
}

.um .um-field-label {
    color: #181818 !important;
    padding: 0px !important;
    margin: 0px !important;
}

.um-row {
	margin: 0px !important;
}

.um-toggle-terms {
	display: none !important;
}

.um-toggle-password {
    font-size: 32px !important;
    margin-right: 12px !important;
	color: var(--title-primary, #aaa);
}


.um-toggle-password:hover i {
	color: #10b981;
}

@media screen and (min-width: 768px) {
	
	.um-register .um-left.um-half {
		float: right;
	}


	.um-register .um-right.um-half {
		text-align: left !important;
		width: 52% !important;
	}

	.um-login .um-left.um-half {
		float: right;
	}


	.um-login .um-right.um-half {
		text-align: left !important;
		width: 52% !important;
	}
}


.um-register .um-left.um-half .um-button,
.um-login .um-left.um-half .um-button {
	font-size: 20px !important;
    font-weight: 500 !important;
    padding: 12px 30px !important;
    display: flex;
	border-radius: 350px !important;
}

.um-register .um-right.um-half .um-button, .um-register .um-col-alt {
    margin: 0px !important;
    padding-top: 28px !important;
    border-top: 2px solid var(--divider, rgba(24, 24, 24, 0.10));
}
.um-field.um-field-c {
    margin: 0px !important;
    padding-top: 10px !important;
    padding-bottom: 30px !important;
    border-bottom: 2px solid var(--divider, rgba(24, 24, 24, 0.10));
    margin-bottom: 42px !important;
}
.um-register .um-right.um-half .um-button, .um-register .um-right.um-half .um-button:hover,
.um-login .um-right.um-half .um-button, .um-login .um-right.um-half .um-button:hover {
	background: transparent !important;
    color: #000 !important;
    text-decoration: underline !important;
    text-align: left;
    font-size: 16px;
    font-weight: 400 !important;
    text-align: left !important;
    padding: 16px 0px 0px !important;
	box-shadow: none !important;
}

@media screen and (max-width: 767px) {
	
	.um-register .um-right.um-half .um-button, .um-register .um-right.um-half .um-button:hover,
	.um-login .um-right.um-half .um-button, .um-login .um-right.um-half .um-button:hover {
 		text-align: center !important;
	}

	.um-register .um-left.um-half,
	.um-login .um-left.um-half {
		width: 100% !important;
		float: none !important;
	}


	.um-register .um-right.um-half ,
	.um-login .um-right.um-half {
		width: 100% !important;
	}

	.um-field-checkbox:not(.um-field), .um-field-radio:not(.um-field) {
		display: block;
		margin: 0px;
		position: relative;
		width: 100%;
	}
}


.um-register .um-field-area,
.um-register .um-field-radio-option {
    margin-bottom: 12px !important;
	color: var(--title-primary, #181818);

}

 .um.um.um-profile .um-field-type_radio label.um-field-radio {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-width: 10rem;
	/*padding: 12px 22px ;*/
	border: 2px solid rgba(24, 24, 24, 0.1) !important; /* Border for inactive state */
	border-radius: 350px;
	background: var(--background-primary, #FFFFFF);
	box-sizing: border-box;
	cursor: pointer;
	transition: all 0.2s ease-in-out;
	text-align: center;
	margin: 0px !important;
}

/* Remove border for active profile radio buttons */
.um.um.um-profile .um-field-type_radio label.um-field-radio.active,
.um.um.um-profile .um-field-type_radio label.um-field-radio:has(input[type="radio"]:checked) {
	border: none !important;
}

/**
 * Radio and Checkbox Button Styling
 * Styles for Ultimate Member radio button and checkbox fields in form areas
 */

/* =========================================================
   Registration Form 7097 - Radio Button Styling (Popup)
   Smaller padding and font size for popup registration form
   ========================================================= */

/* Container layout: Left-aligned buttons with 8px gap */
.um.um-7097 .um-field-type_radio .um-field-area {
	justify-content: flex-start !important; /* Align buttons to the left */
	gap: 8px !important; /* 8px gap between buttons */
}

/* Button styling for registration form 7097 */
.um-7097 .um-field-type_radio label.um-field-radio {
	padding: 8px 16px !important; /* Smaller padding for popup */
	border-radius: 350px !important;
	min-width: auto !important; /* Remove min-width restriction */
}

/* Text styling for registration form 7097 */
.um-7097 .um-field-type_radio label.um-field-radio .um-field-radio-option {
	font-family: Poppins !important;
	font-weight: 500 !important;
	font-style: normal !important;
	font-size: 14px !important;
	line-height: 100% !important;
	letter-spacing: 0% !important;
	text-align: center !important; /* Center text within button */
}

/* =========================================================
   Ultimate Member Checkbox and Radio Button Styling
   Global pill-button styling for all UM forms
   Based on Figma "selection buttons small" design
   ========================================================= */

/* =========================================================
   Container Styling
   ========================================================= */

/* Container for all checkbox and radio button fields */
.um .um-field-type_checkbox .um-field-area,
.um .um-field-type_radio .um-field-area {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex !important;
	flex-wrap: wrap !important;
	row-gap: 8px !important;
	column-gap: 8px !important;
	justify-content: flex-start !important; /* Left-aligned by default */
}

/* Center alignment on screens larger than 1024px */
@media screen and (min-width: 1025px) {
	.um .um-field-type_checkbox .um-field-area,
	.um .um-field-type_radio .um-field-area {
		justify-content: center !important; /* Center buttons on desktop */
	}
}

/* Reset margin-left and padding-left for field areas on 767px and larger */
@media screen and (min-width: 768px) {
	.um .um-field-type_radio .um-field-area,
	.um .um-field-type_checkbox .um-field-area {
		margin-left: 0 !important;
		padding-left: 0 !important;
	}
}

/* =========================================================
   Reset Standard UM Layout
   ========================================================= */

/* Reset width, float, and clear for all checkbox and radio buttons */
.um .um-field-type_checkbox label.um-field-checkbox,
.um .um-field-type_checkbox label.um-field-checkbox.um-field-half,
.um .um-field-type_checkbox label.um-field-checkbox.left,
.um .um-field-type_checkbox label.um-field-checkbox.right,
.um .um-field-type_radio label.um-field-radio,
.um .um-field-type_radio label.um-field-radio.um-field-half,
.um .um-field-type_radio label.um-field-radio.left,
.um .um-field-type_radio label.um-field-radio.right {
	width: auto !important;
	float: none !important;
	clear: none !important;
	margin: 0 !important; /* Reset all margins */
}

/* Hide um-clear divs */
.um .um-field-type_checkbox .um-clear,
.um .um-field-type_radio .um-clear {
	display: none !important;
}

/* Reset margins on option text elements that might be wrappers */
.um .um-field-type_checkbox .um-field-checkbox-option,
.um .um-field-type_checkbox .um-field-area .um-field-checkbox-option,
.um .um-field-type_radio .um-field-radio-option,
.um .um-field-type_radio .um-field-area .um-field-radio-option {
	margin: 0 !important;
	margin-bottom: 0 !important;
}

/* =========================================================
   Hide Default UM Icons
   ========================================================= */

/* Hide standard checkbox icons from UM */
.um .um-field-type_checkbox label.um-field-checkbox .um-field-checkbox-state,
.um .um-field-type_checkbox label.um-field-checkbox .um-icon-android-checkbox-outline-blank,
.um .um-field-type_checkbox label.um-field-checkbox .um-icon-android-checkbox-outline,
.um .um-field-type_checkbox label.um-field-checkbox .um-icon-android-checkbox,
/* Hide standard radio button icons from UM */
.um .um-field-type_radio label.um-field-radio .um-field-radio-state,
.um .um-field-type_radio label.um-field-radio .um-icon-android-radio-button-on,
.um .um-field-type_radio label.um-field-radio .um-icon-android-radio-button-off {
	display: none !important;
}

/* =========================================================
   Input Accessibility
   ========================================================= */

/* Input: Accessible but visually hidden */
.um .um-field-type_checkbox label.um-field-checkbox input[type="checkbox"],
.um .um-field-type_radio label.um-field-radio input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	pointer-events: none;
}

/* =========================================================
   Default Button State (Not Selected)
   ========================================================= */

/* Base pill button styling for all checkboxes */
.um .um-field-type_checkbox label.um-field-checkbox {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px !important;
	padding: 8px 16px !important;
	border-radius: 350px;
	border: 2px solid rgba(24, 24, 24, 0.1) !important;
	background: #ffffff !important;
	opacity: 1;
	margin: 0 !important; /* Reset any default margins that could affect row-gap */
	box-sizing: border-box !important;
	width: auto !important;
	flex-shrink: 0 !important;
	flex-grow: 0 !important;
	cursor: pointer;
	text-align: center;
	white-space: nowrap;
	transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out !important;
}

/* Base pill button styling for all radio buttons */
.um .um-field-type_radio label.um-field-radio {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px !important;
	padding: 8px 16px !important;
	border-radius: 350px;
	border: 2px solid rgba(24, 24, 24, 0.1) !important;
	background: #ffffff !important;
	opacity: 1;
	margin: 0 !important; /* Reset any default margins that could affect row-gap */
	box-sizing: border-box !important;
	width: auto !important;
	flex-shrink: 0 !important;
	flex-grow: 0 !important;
	cursor: pointer;
	text-align: center;
	white-space: nowrap;
	transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out !important;
}

/* =========================================================
   Text Styling
   ========================================================= */

/* Checkbox text styling */
.um .um-field-type_checkbox label.um-field-checkbox .um-field-checkbox-option {
	font-family: Poppins, sans-serif !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	font-style: normal !important;
	line-height: 100% !important;
	letter-spacing: 0% !important;
	text-align: center !important;
	color: rgba(24, 24, 24, 1) !important;
	display: block;
	pointer-events: none;
	margin: 0 !important;
}

/* Radio button text styling */
.um .um-field-type_radio label.um-field-radio .um-field-radio-option {
	font-family: Poppins, sans-serif !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	font-style: normal !important;
	line-height: 100% !important;
	letter-spacing: 0% !important;
	text-align: center !important;
	color: rgba(24, 24, 24, 1) !important;
	display: block;
	pointer-events: none;
	margin: 0 !important;
}

/* =========================================================
   Hover State (Only for Non-Active Buttons)
   ========================================================= */

/* Hover state for checkboxes (not active) */
.um .um-field-type_checkbox label.um-field-checkbox:not(.active):hover,
.um .um-field-type_checkbox label.um-field-checkbox:not(:has(input[type="checkbox"]:checked)):hover {
	background: rgba(24, 24, 24, 0.1) !important;
	border: 2px solid transparent !important;
	padding: 8px 16px !important;
	margin: 0 !important; /* Ensure no margin on hover */
	box-sizing: border-box !important;
	width: auto !important;
	flex-shrink: 0 !important;
	flex-grow: 0 !important;
}

/* Hover state for radio buttons (not active) */
.um .um-field-type_radio label.um-field-radio:not(.active):hover,
.um .um-field-type_radio label.um-field-radio:not(:has(input[type="radio"]:checked)):hover {
	background: rgba(24, 24, 24, 0.1) !important;
	border: 2px solid transparent !important;
	padding: 8px 16px !important;
	margin: 0 !important; /* Ensure no margin on hover */
	box-sizing: border-box !important;
	width: auto !important;
	flex-shrink: 0 !important;
	flex-grow: 0 !important;
}

/* Keep text color on hover */
.um .um-field-type_checkbox label.um-field-checkbox:hover .um-field-checkbox-option,
.um .um-field-type_radio label.um-field-radio:hover .um-field-radio-option {
	color: rgba(24, 24, 24, 1) !important;
}

/* =========================================================
   Active/Selected State
   ========================================================= */

/* Active state for checkboxes */
.um .um-field-type_checkbox label.um-field-checkbox.active,
.um .um-field-type_checkbox label.um-field-checkbox:has(input[type="checkbox"]:checked) {
	background-color: rgba(24, 24, 24, 1) !important;
	border: 2px solid transparent !important;
	padding: 8px 16px !important;
	margin: 0 !important; /* Ensure no margin when active */
	box-sizing: border-box !important;
}

/* Active state for radio buttons */
.um .um-field-type_radio label.um-field-radio.active,
.um .um-field-type_radio label.um-field-radio:has(input[type="radio"]:checked) {
	background-color: rgba(24, 24, 24, 1) !important;
	border: 2px solid transparent !important;
	padding: 8px 16px !important;
	margin: 0 !important; /* Ensure no margin when active */
	box-sizing: border-box !important;
}

/* White text color when selected */
.um .um-field-type_checkbox label.um-field-checkbox.active .um-field-checkbox-option,
.um .um-field-type_checkbox label.um-field-checkbox:has(input[type="checkbox"]:checked) .um-field-checkbox-option,
.um .um-field-type_radio label.um-field-radio.active .um-field-radio-option,
.um .um-field-type_radio label.um-field-radio:has(input[type="radio"]:checked) .um-field-radio-option {
	color: #ffffff !important;
	font-weight: 500 !important;
}

/* =========================================================
   Ensure Active Buttons Don't Change on Hover
   ========================================================= */

/* Prevent hover changes for active checkboxes */
.um .um-field-type_checkbox label.um-field-checkbox.active:hover,
.um .um-field-type_checkbox label.um-field-checkbox:has(input[type="checkbox"]:checked):hover {
	background-color: rgba(24, 24, 24, 1) !important;
	border: 2px solid transparent !important;
}

/* Prevent hover changes for active radio buttons */
.um .um-field-type_radio label.um-field-radio.active:hover,
.um .um-field-type_radio label.um-field-radio:has(input[type="radio"]:checked):hover {
	background-color: rgba(24, 24, 24, 1) !important;
	border: 2px solid transparent !important;
}

/* Keep white text on hover for active buttons */
.um .um-field-type_checkbox label.um-field-checkbox.active:hover .um-field-checkbox-option,
.um .um-field-type_checkbox label.um-field-checkbox:has(input[type="checkbox"]:checked):hover .um-field-checkbox-option,
.um .um-field-type_radio label.um-field-radio.active:hover .um-field-radio-option,
.um .um-field-type_radio label.um-field-radio:has(input[type="radio"]:checked):hover .um-field-radio-option {
	color: #ffffff !important;
}

/* =========================================================
   Mobile Styling (≤767px)
   ========================================================= */

@media screen and (max-width: 767px) {
	/* Hide um-clear divs that are used for float clearing - not needed with flexbox */
	.um-field-area .um-clear {
		display: none !important;
	}
}

/* Mobile-specific checkbox/radio field adjustments */
.um-field-checkbox:not(.um-field),
.um-field-radio:not(.um-field) {
	display: block;
	margin: 0px 0;
	position: relative;
}

/* =========================================================
   Page-Specific Styles (from Elementor custom CSS)
   ========================================================= */




/* Hide loose header elements, but not the photo */
.um-header.no-cover .um-profile-meta,
.um-header.no-cover .um-profile-name,
.um-header.no-cover .um-profile-edit,
.um-header.no-cover .um-request-button,
.um-profile-navbar,
.um-profile-nav,
/*.um-button,*/
.bp-better-messages-mini-mobile-open-icon,
.bp-better-messages-mini-mobile-container,
.bp-better-messages-mini-mobile-open {
	display: none !important;
}

/* Hide header + profile photo + black bar except for Dashboard page */
body:not(.page-id-4766, .page-id-3562) .um-header.no-cover,
body:not(.page-id-4766, .page-id-3562) .um-header.no-cover .um-profile-photo,
body:not(.page-id-4766, .page-id-3562) .um-profile-navbar,
body:not(.page-id-4766, .page-id-3562) .um-profile-nav {
	display: none !important;
}



.um-field.um-field-type_terms_conditions {
    padding-top: 2px !important;
    padding-bottom: 8px !important;
}


.um-form input[type="text"]:focus,
.um-form input[type="email"]:focus,
.um-form input[type="url"]:focus,
.um-form input[type="password"]:focus,
.um-form input[type="tel"]:focus,
.um-form input[type="number"]:focus,
.um-form input[type="search"]:focus,
.um-form textarea:focus{
	border: 2px solid var(--accent-green, #10B981) !important;
}

#profile-step-prev-btn .elementor-button-icon svg {
	width: 24px !important;
	height: 24px !important;
}

#profile-step-prev-btn-mob .elementor-button-icon svg {
	width: 32px !important;
	height: 32px !important;
}

#profile-step-prev-btn-mob .elementor-button {
	font-size: 18px !important;
	font-weight: 500 !important;
	padding: 0px 20px 0px !important;
}

@media (max-width: 480px) {
	.um.um-profile .um-field-type_radio .um-field-area { 
			flex-direction: row !important;
		align-items: normal !important;
		justify-content: baseline !important;
	}
	.um.um-profile .um-field-type_checkbox .um-field-area { 
			flex-direction: row !important;
		align-items: normal !important;
		justify-content: baseline !important;
	}
}

#um-submit-btn:disabled,
#sticky-submit-btn a.elementor-button.disabled { 
	opacity: 0.2;
	background:rgb(129,138,150) !important;
}

/**
 * Dashboard hover background for cards
 **/

.page-id-4766 a.elementor-element  div:nth-child(1) > img{
   filter: brightness(0) saturate(100%) invert(61%) sepia(82%) saturate(321%) hue-rotate(111deg) brightness(94%) contrast(92%);
}
.page-id-4766 a.elementor-element:hover div > img {
	filter: brightness(0) saturate(100%);
}

/** Notices **/
.um-notices-wrap.yes-shortcode {
	position: static;
	bottom: auto;
	left: auto;
	right: auto;
	box-shadow: none;
	border-radius: 12px;
	max-width: 100%;
	padding: 20px;
	background: #181818;
	color: #666;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
	margin-bottom: 15px;
}

.um-notices-wrap.yes-shortcode .um-notices-close {
	right: 10px;
	top: 0;
}

.um-notices-wrap.no-shortcode.um-notices-right {
	left: auto;
	right: 40px;
}

.um-notices-wrap.no-shortcode {
	padding: 10px 20px;
	margin: 0 !important;
	background: #f1f1f1;
	color: #666;
	font-size: 13px;
	position: fixed;
	bottom: -300px;
	left: 40px;
	max-width: 360px;
	z-index: 2147483647;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
	border-radius: 12px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
}

.um-notices-box {
	padding: 0 20px;
	position: relative;
}

.um-notices-box.has-icon {
	padding-left: 40px;
}

.um-notices-wrap p {
	display: inline-block !important;
	margin: 0 !important;
	padding: 0 !important;
	vertical-align: middle;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

.um-notices-wrap i {
	position: absolute;
	top: 0;
	left: 0;
	line-height: 1em;
	font-size: 16px !important;
}

.um-notices-close {
	position: absolute;
	right: 3px;
	top: -4px;
	color: #999;
	text-decoration: none !important;
	font-size: 10px;
}

.um-notices-close:focus {
	outline: 0 !important;
}

.um-notices-box audio {
	min-width: 220px;
}

.um-notices-box * {
	max-width: 100%;
}

.um-notices-cta {
	display: block;
	margin: 10px 0 5px 0;
}

.um-notices-cta a {
	display: inline;
	padding: 8px 12px !important;
	border-radius: 3px;
	text-decoration: none !important;
	font-weight: 400 !important;
}

@media screen and (max-width: 1024px) {
	.um-notices-wrap.yes-shortcode {
		font-size: 14px !important;
		font-weight: 400 !important;
		line-height: 24px !important;
	}
	.um-notices-wrap.no-shortcode {
		max-width: 100% !important;
		min-width: 100% !important;
		right: auto !important;
		left: 0 !important;
		font-size: 14px !important;
		font-weight: 400 !important;
		line-height: 24px !important;
	}
	.um-notices-wrap p {
		font-size: 14px !important;
		font-weight: 400 !important;
		line-height: 24px !important;
	}
}


/**
 * Profile Avatar uploader
 */
 .um-8361 .um-profile-content-container {
	display:none !important;
 }
 .um-8361, .um-8361 .um-profile.um-editing, .um-8361 .um-header {
	margin: 0px !important;
	padding: 0px !important;
 }

 .um-8361.uimob340 .um-header.no-cover .um-profile-photo a.um-profile-photo-img {
width: 100% !important;
height: 100% !important;
}

.um-8361 .um-profile-photo-overlay {
	display: none !important;
}

[data-element="div.um-profile-photo"] {
	top: 110px !important;
}

/**
 * Profile Avatar
 */
.um-4771 .um-theme-profile-single-content,
.um-4771 .um-theme-profile-single-content-container,
.um-4771 .um-profile-content-container{
	padding:0px !important;
	margin:0px !important;
}

/**
 * Terms & Conditions link color
 */
 .um-field-type_terms_conditions a {
	text-decoration: underline !important;
 }
.um-field-type_terms_conditions a:hover {
	text-decoration: none !important;
}

/** Profile form **/
.um-profile.um-viewing .um-field-label {
	display: block;
	margin: 0 0 8px 0;
	border-bottom: none !important;
	padding-bottom: 4px;
	
}
.um-profile.um-viewing .um-field-label label{
	color: rgba(24, 24, 24, 0.6)  !important;
	font-size: 12px !important;
	font-style: normal !important;
	font-weight: 400;
}

.um-profile.um-viewing .um-field {
	border-bottom: 2px solid rgba(24, 24, 24, 0.1) !important;
	padding: 12px 0px 12px 0px !important;
	margin-bottom: 32px !important;
}

.um-profile.um-viewing .um-field:not(.um-field-textarea) .um-field-value{
	color:  #181818 !important;
	font-size: 16px !important;
	font-style: normal !important;
	font-weight: 600 !important;
	line-height: 24px !important;
}

.um-profile.um-viewing .um-profile-body {
	padding: 0px !important;
	margin: 0px !important;
}

.um-profile.um-viewing .um-profile-content-container .boot-row {
	margin: 0px !important;
	padding: 0px !important;
}

.page-id-7071  .um-is-editing-profile #vanl-edit-profile-btn {
	display: none !important;
}

.page-id-7071  .um-is-editing-profile .um.um.um-profile .um-field-type_radio label.um-field-radio {
	align-items: initial !important;
	justify-content: initial !important;
	padding: 0px !important;
}

/** Bookmarks **/
.um-directory .um-members-wrapper .um-members.um-members-list {
	display: grid;
	grid-template-rows: auto 2fr;
	grid-template-columns: repeat(2,2fr) !important;
	grid-gap: 20px;
}

@media screen and (max-width: 767px) {
	.um-directory .um-members-wrapper .um-members.um-members-list {
		display: grid;
		grid-template-rows: auto 2fr;
		grid-template-columns: repeat(1, 2fr) !important;
		grid-gap: 20px;
	}
}

.um-directory .um-members-wrapper .um-member .um-member-card {
	padding-bottom:  0px !important;
}

.um-directory .um-members-wrapper .um-members.um-members-list .um-member {
	border-radius: 12px;
	background: #FFF;
	border: 0px !important;
	box-shadow: 6px 6px 34px -10px rgba(0, 0, 0, 0.25);
	padding: 32px !important;
	min-height: 260px !important;
	max-height: 260px !important;
}
.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-container{
	margin-bottom:  0px !important;
}
.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-container-wrapper {
	padding:50px;
}
.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-container .um-member-photo {
	width: 71px !important;
	margin: 0px !important;
}
.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-photo a img {
	width: 71px !important;
	height: 100% !important;
	max-height: 71px !important;
	border-radius: 360px !important;
}
.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-container .um-member-card {
	width: 100% !important;
	margin-left: 10px !important;
}
.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-container .um-member-card .um-member-card-content .um-member-card-header .um-member-name a{
	color: var(--Color-black, #111827);
	font-family: Poppins;
	font-size: 16px !important;
	font-style: normal !important;
	font-weight: 600 !important;
	line-height: 26px !important; /* 162.5% */
}

.um-directory .um-members-wrapper .um-members.um-members-list .um-member  .um-member-card-actions {
	display: none !important
}

.um-directory .verified-badge{
	color: var(--body-copy, rgba(24, 24, 24, 0.60));
	font-family: Poppins;
	font-size: 10px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	display: inline;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: var(--background-secondary, #F3F4F6);
	float: right;
	position: relative;
	height: 21px !important;
	padding: 3px 4px 0px 4px !important;
	border-radius: 4px !important;
}

.um-directory .verified-badge svg{
	width: 12px !important;
	height: 12px !important;
	margin-right: 4px;
}
@media screen and (max-width: 767px) {
	.um-directory .verified-badge span {
		display: none;
	}

	.um-directory .verified-badge {
        padding: 2px 6px 2px 6px !important;
    }

	.um-directory .verified-badge svg {
		width: 17px !important;
		height: 17px !important;
		margin-right: 0px !important;
	}
}

.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-container .um-member-card .um-member-card-content {
	width: 100% !important;
	padding-left: 10px !important;
}

.um-directory .um-member-registered{
	color: rgba(24, 24, 24, 0.60);
	font-family: Poppins;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-align: left;
}

.um-directory .um-member-remove {
	color: #000;
	font-family: Poppins;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: auto;
	text-underline-offset: auto;
	text-underline-position: from-font;
	text-align: center;
	padding: 21px 0px 50px 0px !important;
	display: block !important;
}

.um-directory .um-member-remove span {
	text-decoration: underline;
}
.um-directory .um-member-remove span:hover {
	text-decoration: none;
}
.um-member-remove img {
	display: inline !important;
}

.um-directory  .field-label {
	color: var(--title-primary, #181818);
	font-family: Poppins;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	margin-right: 16px;
}

.um-directory .um-member-card-profile-desc {
	color: rgba(24, 24, 24, 0.60);
	font-family: Poppins;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	height: 200px !important
}

@media screen and (max-width: 767px)  {
	.um-directory .um-member-card-profile-desc {
		margin-top: 20px !important;
	}
}

.um-directory .um-member-card-profile-desc .lees-meer{
	color: #181818;
	font-family: Poppins;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: auto;
	text-underline-offset: auto;
	text-underline-position: from-font;
}

.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-container .um-member-card .um-member-card-content .um-member-tagline {
	padding-top:5px !important
}

.um-directory .um-members-wrapper .um-members.um-members-list .um-member .um-member-card-footer {
	display: block !important
}

.vanl-buttons-container {
	display: inline;
}
.um-directory .um-button-bookmark {
	display: flex;
	width: 38px;
	height: 38px;
	justify-content: center;
	align-items: center;
	gap: 7.778px;
	aspect-ratio: 1/1;
	border-radius: 49px;
	border: 1.556px solid  #181818 !important;
}

.um-directory .um-button-default-accent-green:hover {
	background-color: #169168 !important;
}

.um-directory .um-button-bookmark:hover{
	background: rgba(24, 24, 24, 0.10) !important;
}
.um-directory .um-button-bookmark svg {
	margin-top: 2px;
}

.um-directory .um-button-bookmark svg path{
	fill: transparent !important;
	stroke: #181818 !important;
}

.um-directory .um-button-bookmark.active svg path {
	fill: #181818 !important;
}


.um-directory .um-button-bookmark.active:hover svg path{
	fill: transparent !important;
}
.um-directory .um-button-bookmark.active:hover svg path{
	stroke: #181818 !important;
}


.um-directory .um-button-default-accent-green {
	width: 80% !important;
}

.um-directory .vanl-buttons-container {
	display: flex;
	column-gap: 12px;
}

.um-directory .um-members-wrapper .um-members .um-member .um-member-card .um-member-name a {
	text-align: left !important;
}
/**
  * Account forms
  */
.um-page-account .um-button {
	display: block;
	flex: 1 0 0 !important;
	border-radius: 350px !important;
	background: var(--accent-green, #10B981) !important;
	width: 100% !important;
	text-align: center !important;
	color: #FFF !important;
	font-family: Poppins !important;
	font-size: 20px !important;
	font-style: normal !important;
	font-weight: 500 !important;
	line-height: normal !important;
	height: 54px !important;
	padding: 12px 30px !important;
	
}

#um_account_submit_delete, .um-button.danger {
	display: inline-flex !important;
	height: 54px !important;
	padding: 12px 30px !important;
	justify-content: center !important;
	align-items: flex-start !important;
	gap: 10px !important;
	border-radius: 350px !important;
	background: var(--accent-red, #D4090C) !important;
}

#vanl-delete-account-wrap #um_field_0_single_user_password {
	width: 368px !important;
	display: inline-block !important;
	margin-right: 45px !important;
}
#vanl-delete-account-wrap #um_field_0_single_user_password .um-field-area-password {
	width: 368px !important;
}
#vanl-delete-account-wrap .um-col-alt {
	display: inline-flex !important;
}
#vanl-delete-account-wrap p {
	display: none !important;
}

#vanl-delete-account-wrap #vanl-account-delete-desc p {
	display: block !important;
}
/** 
 * VA Directory 
 **/
 .um-directory.um-a1fbb .um-members-wrapper .um-members.um-members-list {
	column-gap: 27px !important;
	row-gap: 30px !important;
	
 }

  .um-directory.um-a1fbb .um-member-directory-header-row.um-member-directory-search-row {
	display: none !important;
 }

 .um-directory.um-a1fbb .um-members-pagination-box {
	margin-top: 115px !important;
 }

 /**
  * VA Directory Popup
  */
#vanl-show-profile-popup .elementor-button-icon svg {
	height: auto !important;
	width: 18px !important;
}

#vanl-show-profile-popup .elementor-button-text {
	
}

#vanl-verified-buttons .elementor-button-text {
	
}

#vanl-popup-actions a.elementor-button-link {
	
}

#vanl-verified-buttons a.elementor-button-link {
	padding: 5px 10px 5px 10px !important;
	line-height: 18px;
}

#vanl-show-profile-popup ul.website-links {
	list-style: none !important;padding:0px;margin:0px;
}

#vanl-show-profile-popup .elementor-element {
	line-height: 0px !important;
}

#vanl-show-profile-popup ul.website-links li a {
	text-decoration: underline !important;
}

#vanl-show-profile-popup .um-button-bookmark.active,
#vanl-vacature-single-job-view .um-button-bookmark.active,
#vanl-show-profile-popup .um-button-bookmark.active .elementor-button-text,
#vanl-vacature-single-job-view .um-button-bookmark.active .elementor-button-text {
	background-color: #181818;
	color: #FFF;
}
#vanl-show-profile-popup .um-button-bookmark.active svg path,
#vanl-vacature-single-job-view .um-button-bookmark.active svg path{
	fill:  rgba(16, 185, 129, 1) !important;
	stroke: rgba(16, 185, 129, 1) !important;
}

#vanl-show-profile-popup .ina-contact-va-form button,
#vanl-show-profile-popup .elementor-field-type-submit {
	display: none !important;
}

#vanl-show-profile-popup .ina-contact-va-form #ina-contact-va-message {
	height: 272px !important;
}

/**
 * Real-time notifications
 */
 .um-notifications-filter.active {
	background:#181818 !important;
	border-color: #181818 !important;
	color: #fff;
}

 .um-notifications-filter:hover {
	border-color: rgba(16, 185, 129, 1) !important;
	color: rgba(16, 185, 129, 1) !important;
 }

.um-notification.unread {
	background: #f9f9f9;
	border-left: 3px solid rgba(16, 185, 129, 1) !important;
}

.um-notification-actions-a {
	color:  rgba(16, 185, 129, 1) !important;
	text-decoration: none;
}

/**
 * Vacatures Search Directory
 */
 #vanlsearchvacatures .elementor-message {
	display: none !important;
 }


 @keyframes skeleton-loading {
  0% {
    background-color: hsl(200, 20%, 70%); /* Starting color */
  }
  100% {
    background-color: hsl(200, 20%, 95%); /* Ending color */
  }
}

.vanl-loop-loading  {
  border-radius: 8px;
}

.skeleton {
  background-color: #e0e0e0; /* Light gray background */
  animation: skeleton-loading 1.5s infinite linear alternate; /* Pulsing animation */
}

/* Example for a skeleton text line */
.skeleton-text {
  height: 1em; /* Adjust based on desired text line height */
  width: 100%; /* Adjust based on desired text line width */
  margin-bottom: 0.5em;
  border-radius: 4px;
}

/* Example for a skeleton image placeholder */
.skeleton-image {
  height: 150px; /* Set a fixed height for the image placeholder */
  width: 100%;
  border-radius: 8px;
}

@media screen and (min-width: 768px) {
	.vanl-loop-loading {
		width: 80% !important;
		margin: 0 auto !important;
		padding-top: 50px !important;
		display: block !important;
	}
}

/**
 * Ultimate Member Forms - Single Column Below 1040px
 */
@media screen and (max-width: 1024px) {
	.um-field-half,
	.um-field-half.right,
	.um-half,
	.um-7097.um,
	.um-register,
	.um-login,
	.um-field-radio.um-field-half,
	.um-field-radio.um-field-half.right {
		width: 100% !important;
		float: none !important;
		margin-right: 0 !important;
		margin-bottom: 15px !important;
	}
	
	.um-field-tri {
		width: 100% !important;
		float: none !important;
		margin-right: 0 !important;
		margin-bottom: 15px !important;
	}
}

/**
 * Remove box-shadow from blog post container
 */
 .s-post__content,
.um .um-profile-nav-item.active a,
.um .um-profile-nav-item.active a:hover,
.um-theme-profile-single-content-container,
.um-theme-profile-single-sidebar-container,
.um-profile-one .um-profile-photo img,
.um-profile-nav-item a:hover,
.widget-area-side .widget,
.um-notification-live-count,
.um-activity-ava img,
.um-activity-comment-avatar img,
.um-activity-faces img.avatar,
.um-header-avatar img,
.um-tab-post-image .wp-post-image:hover,
.um-widget-member-image img,
.header-button-1,
.header-button-2,
.header-msg-ava img,
.slim-box-container,
.dropdown-menu,
.comment-list .comment.depth-1,
.header-profile-section .profile-menu-wrapper,
.site-header,
.um-profile-four,
.um-profile-four-container .um-item,
.profile-float-bar,
.menu-item-has-children .sub-menu,
.blog-post-container {
	box-shadow: none !important;
}