:root {
--black:#444;
--white:#fff;
--light-grey:#f7f7f7;
--dark-grey:#666;
--header-height:60px;
--topbar-height:80px;
--sticky-header-height:70px;
	--bs-gutter-x: 2rem;
	--base-scale: calc(100vw / 75);
  --h1-font-size: clamp(1.8rem, -0.875rem + 5vw, 2.5rem);
	--bodyFontSize:1.2rem;
	--bg-linear-gradient: linear-gradient(0deg, var(--brand-color) 10%, var(--light-brand-color) 50%);
	--bg-linear-gradient-hr: linear-gradient(90deg, var(--light-brand-color) 20%, var(--brand-color) 80%);
  --slides-menu-base-height: 120px;
	--border-radius: 1rem!important;
}

:root {
  --spacing-0: 0;
  --spacing-1: 0.25rem; /* 4px */
  --spacing-2: 0.5rem;  /* 8px */
  --spacing-3: 1rem;    /* 16px */
  --spacing-4: 1.5rem;  /* 24px */
  --spacing-5: 3rem;    /* 48px */
}


body {
color:var(--black);
	font-size: var(--bodyFontSize);
	line-height: 1.3;
}

a {cursor: pointer; color: inherit;}

*:focus {
  outline: none;
}

*:focus-visible {
  outline: 2px dotted var(--light-brand-color);
}


.svg_icon { width: 20px; height: 15px;}
h1,h2,h3,h4 {font-weight: 800; }
h1 {font-size: var(--h1-font-size);}
h2 {font-size: calc(var(--h1-font-size) * 0.7);}
h3 {font-size: calc(var(--h1-font-size) * 0.6); }
h4 {font-size: 100%; }

#page-title h1 { font-weight: 800}
/*#page-title h1.long_title { font-size:var(--h1-font-size-long-title);}*/


#splide .splide__slide .shadow-on-active { 
		transform: scale(0.95);
transform-origin: center;}
#splide .is-active .shadow-on-active { 
	transform: scale(0.98);
	transform-origin: center;
	box-shadow:0 0 10px -5px rgba(0, 0, 0, 0.5);}

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

.fs70 {font-size: 70%;}
.fs80 {font-size: 80%;}
.fs90 {font-size: 90%;}
.fs100 {font-size: 100%;}
.fs120 { font-size: 120%;}
.fs130 { font-size: 130%;}
.fs140 { font-size: 140%;}
.fs160 { font-size: 160%;}
.fs180 { font-size: 180%;}
.fs200 { font-size: 200%;}

.fw700 {font-weight: 700;}
.fw600 {font-weight: 600;}


.font-size-x2 {font-size: 3rem;}
.small, small {
    font-size: .75em;
}
.fs-reset { font-size: var(--bodyFontSize);}

.pb-extra { padding-bottom: 6rem!important;}
.mb-extra { margin-bottom: 6rem!important;}

.full-width {width:100%;}


.h100 { height: 100%;}
.w100 { width: 100%;}
.maxh100 {max-height: 100%;}
.maxw100 {max-width: 100%;}

.w80 { width: 80%!important;}
.w60 { width: 60%!important;}
.w50 { width: 50%!important;}

.lh1, .lh-1 {line-height: 1;}
.lh0, .lh-0 {line-height: 0;}
.lh2 {line-height: 2;}
.vh100 { height: calc(100vh - (calc( 2 * var(--sticky-header-height))));}
.aspect1-1 {aspect-ratio: 1/1;}
.aspect-4-3 {aspect-ratio: 4/3;}
.object-fit-cover {object-fit: cover;}


.category-popups_container .entry[aria-expanded="false"] {box-shadow: 2px 2px 2px rgba(0,0,0,.1)!important;}

.category-popups_container .entry[aria-expanded="true"] {margin-bottom: 40px!important; background-color: white; box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;}

ol.hebrew {
            list-style-type: hebrew;
            direction: rtl;
            padding-right: 2.5rem;
        }

#inline_pdf {display: block;width: 100%;min-height: 1100px;} 

@media (max-width: 768px) {
	.w50, .w60, .w80 { width: 90%!important;}
}

.rounded-kav, .image_radius {border-radius: var(--border-radius);}

.p-absolute {position: absolute; top: 0;right: 0;left: 0;bottom: 0;}
.p-relative {position: relative;}
.o-hidden {overflow: hidden;}
.object-cover { object-fit: cover;}

.table-striped tr:nth-child(odd) input, .table-striped tr:nth-child(odd) textarea {background: white; }



.rabanim-item-image, .page-title-image {
    border-radius: 50%;
    overflow: hidden;
    position: relative;
	top: 0;
	right: 0;
	z-index: 2;
/*	box-shadow:0 0px 15px -5px #000;*/
	
	min-width: 54px;
	aspect-ratio:1/1;
}
.rabanim-item-image img, .page-title-image img {position: absolute; 
top: 0;
bottom: 0;
left: 0;
right: 0;
object-fit: cover;
min-width: 100%;
min-height: 100%;
}
.rabanim_tags_blog_item_title, .rabanim_tags_in_article_title {height:30px;z-index: 1; background: #eee;   margin-inline-start: -5px; border-end-end-radius:var(--border-radius); border-start-end-radius: var(--border-radius); white-space: nowrap; }


.inline_pill {
	background-color: var(--brand-color);
    padding: 1rem;
    border-radius: var(--border-radius);
    clear: both;
}
#jform_commentText {height: 200px!important;}

.form-check .form-check-input, .form-check-inline, .form-check { float: none!important; margin: 0!important; padding: 0!important;}

.form-check, .form-check-input {display: flex;
    align-items: center;
    column-gap: 10px;
} /* fixes the search form areas */

.sm-form-control, .form-control, .inputbox, .cf-input, .onefield input, .custom-select, #jform_commentText {
	font-size: 1.3rem;
    width: 100%;
	padding-inline: 15px;
	padding-block: 6px;
	border-radius: var(--border-radius);
	border: 0 none;
	
	-webkit-box-shadow: inset 3px 3px 6px -5px rgba(0,0,0,0.5); 
	box-shadow: inset 3px 4px 6px -5px rgba(0,0,0,0.5);
	
	margin-bottom: 15px;

	
/*	color: var(--black);*/
	background: #F1F1F1;
}
button { border: 0;}
.button, button:not(.not-button) {
	font-size: 1.3rem;
	position: relative;
	display: inline-block;
	
	padding-block: .375rem;
	padding-inline: 2rem;
	border-radius: var(--border-radius);
	border: 0 none;
/*	margin-bottom: 15px;*/
	font-weight: 800;
	background: var(--light-brand-color);
	text-align: center;
/*	color: var(--black);*/
	-webkit-box-shadow:  3px 3px 6px -5px rgba(0,0,0,0.5); 
	box-shadow:  3px 4px 6px -5px rgba(0,0,0,0.5);
 width: auto; }



.button:hover{
	color: white; 
}

.button-append {    border-end-end-radius: 0;
    border-start-end-radius: 0;
}
.button-prepend {    border-start-start-radius: 0;
    border-end-start-radius: 0;
}

.button.close {
	position: absolute;
    z-index: 2;
    font-size: 150%;
    aspect-ratio: 1 / 1;
    top: -10px;
    right: -10px;
    padding: 0;
    height: 60px;	
}


.button.small { font-size: 90%;padding: 5px; }

.icon_phone {background: var(--bg-linear-gradient);
    aspect-ratio: 1/1;
    border-radius: var(--border-radius);
    line-height: 0; opacity: 1;}



.active > a.type-alias {text-decoration: none;}


.bg_gray { background-color: #efefef;}


.bg_linear-gradient { background: var(--bg-linear-gradient);}
.bg_linear-gradient-hr { background: var(--bg-linear-gradient-hr);}
.bg_linear-gradient a:hover { color: var(--dark-brand-color)!important;}

.dark_to_trans_gradient {background:linear-gradient(0deg,#000 -50%,transparent)}
.bg_brand_to_white_linear {background:linear-gradient(0deg, var(--brand-color-d) -20%, var(--brand-color-e) 70%);
}
.bg_none {background: transparent;}
.gray_white_gradient {background:linear-gradient(0deg,#ccc,#fff)}

.font-weight-black { font-weight: 900;}



::placeholder{ color: var(--black)!important;}


a { text-decoration: none; cursor: pointer; }



a:hover {color: var(--light-brand-color) }

h3 a, h4 a { color: var(--black);}

a img {
border:none
}

img { max-width: 100%;height: auto;}

iframe {
border:none!important
}


.news_item_parent_category {
 background: #4faedd50;}
.news_item_category {
 background: #f1b74950;}

.bg_brand-color {
background:var(--brand-color)!important
}

.bg_dark-brand-color {
background:var(--dark-brand-color)!important
}

.bg_light-brand-color {
background:var(--light-brand-color)!important
}

.bg_brand-color-d {
background:var(--brand-color-d)
}

.bg_brand-color-e {
background:var(--brand-color-e)!important;
}
.bg_brand-color-e > *:not(input):not(select):not(.text-brand-color-e) {
	color: white;
}

.bg_brand-color-e .bg_white > * {
	color:var(--brand-color-e)!important;
}


.bg_brand-color-f {
background:var(--brand-color-f)
}


.bg_light-gray { background: #efefef; box-shadow:none;}
.bg_mid-gray { background: #ccc; box-shadow:none;}

.text-brand-color {
color:var(--brand-color)
}
.text-light-brand-color {
color:var(--light-brand-color)
}
.text-dark-brand-color {
color:var(--dark-brand-color)
}
.text-brand-color-d {
color:var(--brand-color-d)
}
.text-brand-color-e {
color:var(--brand-color-e)
}
.text-brand-color-f {
color:var(--brand-color-f)
}
.text-gray { color: gray; }

.bg_white {
background:var(--white);
color:#000;

}
.bg_black {
background:var(--black);
color:#fff;
}

.text-white *:not(.button), .text-white:not(.button) {
color:#fff
}

.text-black *:not(.button), .text-black:not(.button) {
color:var(--black)
}

.homepage_mod_title h2,.homepage_mod_title {
	background: var(--bg-linear-gradient-hr);
	padding-inline:20px; color: white;
	border-start-end-radius: var(--border-radius);
    border-end-start-radius: var(--border-radius);
	line-height: 2;
}

#page-title .container,#page-title .row, #page-title {
position:relative;
}

#page-title P { font-size: 90%; }

#content { position: relative;}

/*#header + #content:not(.homepage) {padding-top: var(--header-height);}*/


#footer_menu {    column-count: 4;
    column-gap: 2rem;
    column-width: 150px;}

#footer_menu .bg_brand-color-d { background: transparent!important;}

#footer_menu .hide_on_footer {
display: none!important;
}
#footer_menu a {display:inline-flex; padding:3px;}
#footer_menu .parent > a { font-size: 120%; text-decoration: underline;}


.show_on_homepage { display: none!important;}
.homepage .show_on_homepage {display: flex!important;}

.hide_on_homepage { display: flex!important;}
.homepage .hide_on_homepage {display: none!important;} 

.text-colored {
color:var(--brand-color)!important
}



.rtl {
direction:rtl!important
}

.ltr {
direction:ltr!important
}




.columns-2:not(.nav-item *) {columns:300px 2; column-gap: 10%; }
.columns-3:not(.nav-item *) {columns:240px 3; }
.columns-4:not(.no-columns):not(.nav-item > *) {columns:240px 4; }


.no-columns .columns-4 {column-count: 1;}

.styled_list_items {
display:flex;
flex-wrap:wrap;
align-items:center;
list-style:none;
padding:0!important;
margin:20px 0;
margin-left:-10px;
justify-content:space-between
}

.styled_list_items li {
display:flex;
padding:20px;
background:var(--brand-color);
margin-left:10px;
margin-bottom:10px;
flex-grow:1;
font-size:120%;
justify-content:center
}

.styled_list_items li:hover {
background:var(--light-brand-color)
}


.even_odd:nth-child(odd) {background: #efefef; }


#logo img {width: 100%; height: auto; 
}

/* Transitions*/

#cookie-notification,
#top-search a,
#top-search form,
.scalein,
polygon,
#header,
#header.sticky-header,
#logo,#logo-sticky,
#logo.logo_big img,
#logo img,
#submenu,
.whatsapp_button,
.gallery-grid-item *, figure,
.slider_yt_video_wrapper iframe,	
#slide-links-list li a::after,
.splide__pagination__page,
#slide-links-list.sticky-submenu, #submenu.sticky-submenu
,.button_phone, .button_phone *, .show, .splide__slide, .containerOflevel_1, .shadow-on-hover, .shadow-inset-on-hover, .shadow-on-active, #mtbl_all *, .mtbl_container, .navbar .nav-item, .product_order_row, #submenu *

 {
-webkit-transition:all .3s ease-in-out;
-o-transition:all .3s ease-in-out;
transition:all .3s ease-in-out;
}

#header {
	height:var(--header-height);
/*position:relative;z-index:199;-webkit-backface-visibility: hidden;*/
}

#topbar, #topbar .logo  {
	height:var(--topbar-height);
}
/*

#topbar-menu img, #mobile_quick_menu img {width: auto;	height:var(--topbar-height); padding-block: 15px; margin-inline-end: 20px;}
*/
/*

#mobile_quick_menu img {height: calc(var(--topbar-height)* 0.7);}

#topbar-menu a, #mobile_quick_menu a { position: relative;}
#topbar-menu a .menu-image-title, #mobile_quick_menu a .menu-image-title {
	position: absolute;
    background: var(--dark-brand-color);
	color: var(--light-brand-color);
    padding: 3px;
    z-index: 999;
      border-end-end-radius: 10px;
    border-end-start-radius: 10px;
 opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
display: flex;
	padding-inline: 20px;
	width: fit-content;
		min-width: 150px;
font-size: 80%;
	text-align: center;
	justify-content: center;
}
*/


.page-link {
   
    aspect-ratio: 3;
    border-radius: 0 !important;
    text-align: center;
    padding: 5px;
}

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

.dropdown-toggle::after {content: none;}
.dropdown-toggle::after {content: '›';transform: rotate(-90deg); border: 0 none;}




#content ul:not(.sidenav):not(.breadcrumb):not(.fields-container) {
padding:0 20px;
margin-bottom:20px
}

.breadcrumb-item+.breadcrumb-item {padding: 0;}
.breadcrumb-item+.breadcrumb-item::before {
    float: none;
    padding-inline: var(--bs-breadcrumb-item-padding-x);
  
}
#content ul.fields-container { margin-block: 0;margin-inline-end:10px; padding: 0; list-style: none;}



polygon.arrow-a {
fill:var(--light-grey)
}

polygon.arrow-b {
fill:var(--black)
}

polygon.arrow-c {
fill:var(--red)
}




.shadow, .shadow-on-hover:hover {
-webkit-box-shadow:  0px 0px 20px -10px rgba(0,0,0,0.5)!important; 
	box-shadow:  0px 0px 20px -10px rgba(0,0,0,0.5)!important;
	
}

.shadow-inset-on-hover:hover {
-webkit-box-shadow: inset 0px 0px 1px 3px var(--light-brand-color);
	box-shadow: inset 0px 0px 1px 3px var(--light-brand-color);
}
.noshadow {-webkit-box-shadow:none; box-shadow: none;}
.scalein {
-webkit-transform:scale(1);
transform:scale(1)
}

.scalein:hover {
-webkit-transform:scale(1.05);
transform:scale(1.05);
}

#searchForm label {
padding:5px 0
}

#searchForm hr {
margin:10px 0!important
}

.highlight {
border-bottom:1px dotted #666
}


.statement_menu li:not(:last-child)::after {
content:'/';
padding:0 4px;
opacity:.5
}

/* accessibility helpers */
.accessibility {position:absolute;left:-99999px;height:10px;width:10px}
.rtl .accessibility{right: -99999px;left: auto;}

.skip_helpers a {position:absolute;left:-99999px;top:30px}
.rtl .skip_helpers a{right: -99999px;left: auto;}

.skip_helpers {position:absolute;left:0;top:0;width:100%;text-align:center;list-style:outside none}
.rtl .skip_helpers{right: 0;left: auto;}

.skip_helpers li {list-style-type:none}
.skip_helpers a:focus,.skip_helpers a:active {position:relative;
left:0;
z-index:9999;
width:75%;
height:auto;
margin:0 auto;
padding:30px 45px;
text-align:center;
text-decoration:none;
font:bold 30px Arial,Freesans,sans-serif!important;
background: white;
}

.rtl .skip_helpers a:focus, .rtl .skip_helpers a:active{right: 0;left: auto;}
/*end skip helpers*/


/* ACYM */
.acym_inline_pill { padding: 1rem; border-radius:50px; clear: both;}
    

   .acym_inline_pill h3 {padding-bottom: 10px; }
    .acym_inline_pill h3   {padding-bottom: 0px; margin-bottom: 0px;}

   input[name="user[email]"] {text-align: start;
	}
 .acyfield_text input {margin: 0;}

    
    .acym_inline_pill .acyfield_2 { width: 79%;}
 
    .acym_lists {margin-bottom: 10px;}
    .acym_lists label  {padding: 0 5px; }
    
    
    .acym_inline_pill .acym_module form {margin: 0; }
        
     .acym_inline_pill div.acym_module_success {margin-bottom: 0;  background-color: var(--light-brand-color);text-align: center;border-radius: var(--border-radius); color: white; font-weight: 900;}
    
    .acym_module_form input { max-width:100%;}

video {width: 100%; }

@media (min-width: 992px) {

	.nowrap-lg {white-space: nowrap;}
/*
#topbar-menu a:hover .menu-image-title,
	#mobile_quick_menu a:hover .menu-image-title {
	opacity: 1;
    visibility: visible;}
}
*/

@media  (min-width: 768px) {
video {max-height: 500px;  height: auto;}
}

@media (max-width: 991px) {
	.nowrap-lg {white-space: normal;}

.footer_logo {
max-width:100%;
height:100%
}

}
@media (max-width: 575px) {
/*
	#topbar-menu img, #mobile_quick_menu img { padding-block: 0; margin-inline-end: 0;}

	#mobile_quick_menu .hide_on_footer {
display: none!important;
}
*/
       .acym_inline_pill {border-radius: var(--border-radius);}
        .one_field_only .acym_form {padding-left: 0!important;}
	.text-center .breadcrumb {justify-content: center;}
}



.border-end {
	border-right: none!important;
    border-inline-end: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

.border-start {
	border-left: none!important;
    border-inline-start: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

/* Base inline margins and paddings */


.pe-0, 
.pe-1, 
.pe-2, 
.pe-3, 
.pe-4, 
.pe-5, 

.pe-sm-0, 
.pe-sm-1, 
.pe-sm-2, 
.pe-sm-3, 
.pe-sm-4, 
.pe-sm-5, 

.pe-md-0, 
.pe-md-1, 
.pe-md-2, 
.pe-md-3, 
.pe-md-4, 
.pe-md-5, 

.pe-lg-0, 
.pe-lg-1, 
.pe-lg-2, 
.pe-lg-3, 
.pe-lg-4, 
.pe-lg-5, 

.pe-xl-0, 
.pe-xl-1, 
.pe-xl-2, 
.pe-xl-3, 
.pe-xl-4, 
.pe-xl-5, 

.pe-xxl-0, 
.pe-xxl-1, 
.pe-xxl-2, 
.pe-xxl-3, 
.pe-xxl-4, 
.pe-xxl-5


.ps-0, 
.ps-1, 
.ps-2, 
.ps-3, 
.ps-4, 
.ps-5, 

.ps-sm-0, 
.ps-sm-1, 
.ps-sm-2, 
.ps-sm-3, 
.ps-sm-4, 
.ps-sm-5, 

.ps-md-0, 
.ps-md-1, 
.ps-md-2, 
.ps-md-3, 
.ps-md-4, 
.ps-md-5, 

.ps-lg-0, 
.ps-lg-1, 
.ps-lg-2, 
.ps-lg-3, 
.ps-lg-4, 
.ps-lg-5, 

.ps-xl-0, 
.ps-xl-1, 
.ps-xl-2, 
.ps-xl-3, 
.ps-xl-4, 
.ps-xl-5, 

.ps-xxl-0, 
.ps-xxl-1, 
.ps-xxl-2, 
.ps-xxl-3, 
.ps-xxl-4, 
.ps-xxl-5
{
  padding-right: unset!important;padding-left: unset!important;
}

.me-0, 
.me-1, 
.me-2, 
.me-3, 
.me-4, 
.me-5, 

.me-sm-0, 
.me-sm-1, 
.me-sm-2, 
.me-sm-3, 
.me-sm-4, 
.me-sm-5, 

.me-md-0, 
.me-md-1, 
.me-md-2, 
.me-md-3, 
.me-md-4, 
.me-md-5, 

.me-lg-0, 
.me-lg-1, 
.me-lg-2, 
.me-lg-3, 
.me-lg-4, 
.me-lg-5, 

.me-xl-0, 
.me-xl-1, 
.me-xl-2, 
.me-xl-3, 
.me-xl-4, 
.me-xl-5, 

.me-xxl-0, 
.me-xxl-1, 
.me-xxl-2, 
.me-xxl-3, 
.me-xxl-4, 
.me-xxl-5
{
  margin-left: unset!important;margin-right: unset!important;
}

.ms-0, 
.ms-1, 
.ms-2, 
.ms-3, 
.ms-4, 
.ms-5, 

.ms-sm-0, 
.ms-sm-1, 
.ms-sm-2, 
.ms-sm-3, 
.ms-sm-4, 
.ms-sm-5, 

.ms-md-0, 
.ms-md-1, 
.ms-md-2, 
.ms-md-3, 
.ms-md-4, 
.ms-md-5, 

.ms-lg-0, 
.ms-lg-1, 
.ms-lg-2, 
.ms-lg-3, 
.ms-lg-4, 
.ms-lg-5, 

.ms-xl-0, 
.ms-xl-1, 
.ms-xl-2, 
.ms-xl-3, 
.ms-xl-4, 
.ms-xl-5, 

.ms-xxl-0, 
.ms-xxl-1, 
.ms-xxl-2, 
.ms-xxl-3, 
.ms-xxl-4, 
.ms-xxl-5
{
  margin-inline-start: unset!important;
}



/* Override Bootstrap Padding Inline Classes */
.ps-0 { padding-inline-start: var(--spacing-0) !important; }
.ps-1 { padding-inline-start: var(--spacing-1) !important; }
.ps-2 { padding-inline-start: var(--spacing-2) !important; }
.ps-3 { padding-inline-start: var(--spacing-3) !important; }
.ps-4 { padding-inline-start: var(--spacing-4) !important; }
.ps-5 { padding-inline-start: var(--spacing-5) !important; }

.pe-0 { padding-inline-end: var(--spacing-0) !important; }
.pe-1 { padding-inline-end: var(--spacing-1) !important; }
.pe-2 { padding-inline-end: var(--spacing-2) !important; }
.pe-3 { padding-inline-end: var(--spacing-3) !important; }
.pe-4 { padding-inline-end: var(--spacing-4) !important; }
.pe-5 { padding-inline-end: var(--spacing-5) !important; }

/* Override Bootstrap Margin Inline Classes */
.ms-0 { margin-inline-start: var(--spacing-0) !important; }
.ms-1 { margin-inline-start: var(--spacing-1) !important; }
.ms-2 { margin-inline-start: var(--spacing-2) !important; }
.ms-3 { margin-inline-start: var(--spacing-3) !important; }
.ms-4 { margin-inline-start: var(--spacing-4) !important; }
.ms-5 { margin-inline-start: var(--spacing-5) !important; }

.me-0 { margin-inline-end: var(--spacing-0) !important; }
.me-1 { margin-inline-end: var(--spacing-1) !important; }
.me-2 { margin-inline-end: var(--spacing-2) !important; }
.me-3 { margin-inline-end: var(--spacing-3) !important; }
.me-4 { margin-inline-end: var(--spacing-4) !important; }
.me-5 { margin-inline-end: var(--spacing-5) !important; }

/* Utility function for breakpoints */
@media (min-width: 576px) { /* Small devices */
  .me-sm-0 { margin-inline-end: var(--spacing-0) !important; }
  .me-sm-1 { margin-inline-end: var(--spacing-1) !important; }
  .me-sm-2 { margin-inline-end: var(--spacing-2) !important; }
  .me-sm-3 { margin-inline-end: var(--spacing-3) !important; }
  .me-sm-4 { margin-inline-end: var(--spacing-4) !important; }
  .me-sm-5 { margin-inline-end: var(--spacing-5) !important; }
  
  .ms-sm-0 { margin-inline-start: var(--spacing-0) !important; }
  .ms-sm-1 { margin-inline-start: var(--spacing-1) !important; }
  .ms-sm-2 { margin-inline-start: var(--spacing-2) !important; }
  .ms-sm-3 { margin-inline-start: var(--spacing-3) !important; }
  .ms-sm-4 { margin-inline-start: var(--spacing-4) !important; }
  .ms-sm-5 { margin-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 768px) { /* Medium devices */
  .me-md-0 { margin-inline-end: var(--spacing-0) !important; }
  .me-md-1 { margin-inline-end: var(--spacing-1) !important; }
  .me-md-2 { margin-inline-end: var(--spacing-2) !important; }
  .me-md-3 { margin-inline-end: var(--spacing-3) !important; }
  .me-md-4 { margin-inline-end: var(--spacing-4) !important; }
  .me-md-5 { margin-inline-end: var(--spacing-5) !important; }
  
  .ms-md-0 { margin-inline-start: var(--spacing-0) !important; }
  .ms-md-1 { margin-inline-start: var(--spacing-1) !important; }
  .ms-md-2 { margin-inline-start: var(--spacing-2) !important; }
  .ms-md-3 { margin-inline-start: var(--spacing-3) !important; }
  .ms-md-4 { margin-inline-start: var(--spacing-4) !important; }
  .ms-md-5 { margin-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 992px) { /* Large devices */
  .me-lg-0 { margin-inline-end: var(--spacing-0) !important; }
  .me-lg-1 { margin-inline-end: var(--spacing-1) !important; }
  .me-lg-2 { margin-inline-end: var(--spacing-2) !important; }
  .me-lg-3 { margin-inline-end: var(--spacing-3) !important; }
  .me-lg-4 { margin-inline-end: var(--spacing-4) !important; }
  .me-lg-5 { margin-inline-end: var(--spacing-5) !important; }
  
  .ms-lg-0 { margin-inline-start: var(--spacing-0) !important; }
  .ms-lg-1 { margin-inline-start: var(--spacing-1) !important; }
  .ms-lg-2 { margin-inline-start: var(--spacing-2) !important; }
  .ms-lg-3 { margin-inline-start: var(--spacing-3) !important; }
  .ms-lg-4 { margin-inline-start: var(--spacing-4) !important; }
  .ms-lg-5 { margin-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 1200px) { /* Extra large devices */
  .me-xl-0 { margin-inline-end: var(--spacing-0) !important; }
  .me-xl-1 { margin-inline-end: var(--spacing-1) !important; }
  .me-xl-2 { margin-inline-end: var(--spacing-2) !important; }
  .me-xl-3 { margin-inline-end: var(--spacing-3) !important; }
  .me-xl-4 { margin-inline-end: var(--spacing-4) !important; }
  .me-xl-5 { margin-inline-end: var(--spacing-5) !important; }
  
  .ms-xl-0 { margin-inline-start: var(--spacing-0) !important; }
  .ms-xl-1 { margin-inline-start: var(--spacing-1) !important; }
  .ms-xl-2 { margin-inline-start: var(--spacing-2) !important; }
  .ms-xl-3 { margin-inline-start: var(--spacing-3) !important; }
  .ms-xl-4 { margin-inline-start: var(--spacing-4) !important; }
  .ms-xl-5 { margin-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 1400px) { /* Extra extra large devices */
  .me-xxl-0 { margin-inline-end: var(--spacing-0) !important; }
  .me-xxl-1 { margin-inline-end: var(--spacing-1) !important; }
  .me-xxl-2 { margin-inline-end: var(--spacing-2) !important; }
  .me-xxl-3 { margin-inline-end: var(--spacing-3) !important; }
  .me-xxl-4 { margin-inline-end: var(--spacing-4) !important; }
  .me-xxl-5 { margin-inline-end: var(--spacing-5) !important; }
  
  .ms-xxl-0 { margin-inline-start: var(--spacing-0) !important; }
  .ms-xxl-1 { margin-inline-start: var(--spacing-1) !important; }
  .ms-xxl-2 { margin-inline-start: var(--spacing-2) !important; }
  .ms-xxl-3 { margin-inline-start: var(--spacing-3) !important; }
  .ms-xxl-4 { margin-inline-start: var(--spacing-4) !important; }
  .ms-xxl-5 { margin-inline-start: var(--spacing-5) !important; }
}

/* Utility function for breakpoints */
@media (min-width: 576px) { /* Small devices */
  .pe-sm-0 { padding-inline-end: var(--spacing-0) !important; }
  .pe-sm-1 { padding-inline-end: var(--spacing-1) !important; }
  .pe-sm-2 { padding-inline-end: var(--spacing-2) !important; }
  .pe-sm-3 { padding-inline-end: var(--spacing-3) !important; }
  .pe-sm-4 { padding-inline-end: var(--spacing-4) !important; }
  .pe-sm-5 { padding-inline-end: var(--spacing-5) !important; }
  
  .ps-sm-0 { padding-inline-start: var(--spacing-0) !important; }
  .ps-sm-1 { padding-inline-start: var(--spacing-1) !important; }
  .ps-sm-2 { padding-inline-start: var(--spacing-2) !important; }
  .ps-sm-3 { padding-inline-start: var(--spacing-3) !important; }
  .ps-sm-4 { padding-inline-start: var(--spacing-4) !important; }
  .ps-sm-5 { padding-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 768px) { /* Medium devices */
  .pe-md-0 { padding-inline-end: var(--spacing-0) !important; }
  .pe-md-1 { padding-inline-end: var(--spacing-1) !important; }
  .pe-md-2 { padding-inline-end: var(--spacing-2) !important; }
  .pe-md-3 { padding-inline-end: var(--spacing-3) !important; }
  .pe-md-4 { padding-inline-end: var(--spacing-4) !important; }
  .pe-md-5 { padding-inline-end: var(--spacing-5) !important; }
  
  .ps-md-0 { padding-inline-start: var(--spacing-0) !important; }
  .ps-md-1 { padding-inline-start: var(--spacing-1) !important; }
  .ps-md-2 { padding-inline-start: var(--spacing-2) !important; }
  .ps-md-3 { padding-inline-start: var(--spacing-3) !important; }
  .ps-md-4 { padding-inline-start: var(--spacing-4) !important; }
  .ps-md-5 { padding-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 992px) { /* Large devices */
  .pe-lg-0 { padding-inline-end: var(--spacing-0) !important; }
  .pe-lg-1 { padding-inline-end: var(--spacing-1) !important; }
  .pe-lg-2 { padding-inline-end: var(--spacing-2) !important; }
  .pe-lg-3 { padding-inline-end: var(--spacing-3) !important; }
  .pe-lg-4 { padding-inline-end: var(--spacing-4) !important; }
  .pe-lg-5 { padding-inline-end: var(--spacing-5) !important; }
  
  .ps-lg-0 { padding-inline-start: var(--spacing-0) !important; }
  .ps-lg-1 { padding-inline-start: var(--spacing-1) !important; }
  .ps-lg-2 { padding-inline-start: var(--spacing-2) !important; }
  .ps-lg-3 { padding-inline-start: var(--spacing-3) !important; }
  .ps-lg-4 { padding-inline-start: var(--spacing-4) !important; }
  .ps-lg-5 { padding-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 1200px) { /* Extra large devices */
  .pe-xl-0 { padding-inline-end: var(--spacing-0) !important; }
  .pe-xl-1 { padding-inline-end: var(--spacing-1) !important; }
  .pe-xl-2 { padding-inline-end: var(--spacing-2) !important; }
  .pe-xl-3 { padding-inline-end: var(--spacing-3) !important; }
  .pe-xl-4 { padding-inline-end: var(--spacing-4) !important; }
  .pe-xl-5 { padding-inline-end: var(--spacing-5) !important; }
  
  .ps-xl-0 { padding-inline-start: var(--spacing-0) !important; }
  .ps-xl-1 { padding-inline-start: var(--spacing-1) !important; }
  .ps-xl-2 { padding-inline-start: var(--spacing-2) !important; }
  .ps-xl-3 { padding-inline-start: var(--spacing-3) !important; }
  .ps-xl-4 { padding-inline-start: var(--spacing-4) !important; }
  .ps-xl-5 { padding-inline-start: var(--spacing-5) !important; }
}

@media (min-width: 1400px) { /* Extra extra large devices */
  .pe-xxl-0 { padding-inline-end: var(--spacing-0) !important; }
  .pe-xxl-1 { padding-inline-end: var(--spacing-1) !important; }
  .pe-xxl-2 { padding-inline-end: var(--spacing-2) !important; }
  .pe-xxl-3 { padding-inline-end: var(--spacing-3) !important; }
  .pe-xxl-4 { padding-inline-end: var(--spacing-4) !important; }
  .pe-xxl-5 { padding-inline-end: var(--spacing-5) !important; }
  
  .ps-xxl-0 { padding-inline-start: var(--spacing-0) !important; }
  .ps-xxl-1 { padding-inline-start: var(--spacing-1) !important; }
  .ps-xxl-2 { padding-inline-start: var(--spacing-2) !important; }
  .ps-xxl-3 { padding-inline-start: var(--spacing-3) !important; }
  .ps-xxl-4 { padding-inline-start: var(--spacing-4) !important; }
  .ps-xxl-5 { padding-inline-start: var(--spacing-5) !important; }
}