.elementor-kit-729{--e-global-color-primary:#24799C;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#2E468D;--e-global-typography-primary-font-family:"Amatic SC";--e-global-typography-primary-font-size:42px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-secondary-font-family:"Amatic SC";--e-global-typography-secondary-font-size:30px;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-text-transform:uppercase;--e-global-typography-text-font-family:"Amatic SC";--e-global-typography-text-font-size:25px;--e-global-typography-text-font-weight:400;--e-global-typography-text-text-transform:lowercase;--e-global-typography-text-font-style:normal;--e-global-typography-accent-font-family:"Amatic SC";--e-global-typography-accent-font-size:20px;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-text-transform:lowercase;--e-global-typography-efe0562-font-family:"Melloner-Fun";--e-global-typography-efe0562-font-size:40px;--e-global-typography-efe0562-line-height:41px;--e-global-typography-efe0562-letter-spacing:1.4px;--e-global-typography-efe0562-word-spacing:0px;--e-global-typography-55342b3-font-family:"Melloner-Fun";--e-global-typography-55342b3-font-size:30px;--e-global-typography-55342b3-font-weight:100;--e-global-typography-55342b3-line-height:43px;--e-global-typography-55342b3-letter-spacing:1.8px;--e-global-typography-55342b3-word-spacing:0px;--e-global-typography-8c9564d-font-family:"Amatic SC";--e-global-typography-8c9564d-font-size:30px;--e-global-typography-8c9564d-font-weight:bold;--e-global-typography-8c9564d-line-height:1.5em;--e-global-typography-8c9564d-letter-spacing:1px;}.elementor-kit-729 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}{}.page-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Reset the anchor tags to avoid default browser styles */
#ruler-navigation a {
  text-decoration: none;  /* Remove underlines */
  outline: none;          /* Remove focus outline */
  display: block;         /* Make anchor a block element */
  width: 30px;            /* Slightly thinner line */
  height: 1px;            /* Reduced line thickness */
  background-color: #ccc; /* Default color of the line */
  margin: 16px 0;         /* Space between lines */
  transition: background-color 0.3s ease, transform 0.3s ease, opacity 0.3s ease;
  cursor: pointer;       /* Make the cursor a pointer */
  padding: 2px 0;        /* Larger clickable area */
}

/* Navigation container */
#ruler-navigation {
  position: fixed;
  right: 20px;            /* Position from the right */
  top: 50%;               /* Position in the vertical center */
  transform: translateY(-50%); /* Align vertically center */
  display: flex;
  flex-direction: column; /* Stack lines vertically */
  z-index: 9999;          /* Keep it above all content */
}

/* Hover effect: Highlight line and show label */
.nav-line:hover {
  background-color: #ff4081; /* Highlight color on hover */
  transform: scaleX(1.2);     /* Slightly enlarge the line horizontally */
}

/* Label that appears on hover, positioned on the left */
.nav-line:hover::after {
  content: attr(data-label); /* Display section name */
  position: absolute;
  right: 60px;               /* More space to the left of the line */
  top: 50%;                 /* Vertically center the label */
  transform: translateY(-50%);
  font-size: 16px;          /* Slightly larger font size */
  color: #fff;              /* Label text color */
  opacity: 1;               /* Make label visible */
  transition: opacity 0.3s ease;
}

/* Initially hidden labels */
.nav-line::after {
  content: attr(data-label);
  position: absolute;
  right: 60px;               /* More space to the left of the line */
  top: 50%;                 /* Vertically center the label */
  transform: translateY(-50%);
  font-size: 16px;          /* Font size */
  color: #fff;              /* Label text color */
  opacity: 0;               /* Hide label initially */
  transition: opacity 0.3s ease;
}

/* Active line style for the section in view */
.nav-line.active {
  background-color: #ff4081; /* Highlight the active section */
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Amatic SC';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://amirweiss.com/wp-content/uploads/2020/04/AmaticSC-Regular.ttf') format('truetype');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Melloner-Fun';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('http://amirweiss.com/wp-content/uploads/2024/06/MellonerFunRegular.ttf') format('truetype');
}
/* End Custom Fonts CSS */