/* Page background & fonts style */
body {
   margin: 0;
   padding: 0;
   font-family: Crimson Pro;            
   background-color: #000000;
}

/* Chrome, Edge, Safari Scrollbar*/
::-webkit-scrollbar {
  width: 16px;
}

::-webkit-scrollbar-track {
  background: #000000;
}

::-webkit-scrollbar-thumb {
  background-color: #eaecaa;
  border-radius: 6px;
  border: 2px solid #000000;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #d5d68f;
}

/* Firefox Scrollbar*/
html {
  scrollbar-color: #eaecaa #000000;
  scrollbar-width: auto; /* thicker than thin */
}

/* Makes the header container a positioning reference */
.header-container {
  position: relative;
  width: 1255px;
  height: 213px;
  margin: 0 auto;  /* <-- centers it like the body */
}

/* header and logo image inside header container */
.main-headerimage {
  position: absolute;
  top: 0;   /* distance from top of container */
  left: 0; /* distance from left of container */
  width: 1255px;  /* adjust as needed */
  height: 213px;  /* maintains aspect ratio */
  border-radius: 0; /* optional: rounded corners */
}

/* The invisible clickable phone number box inside the header */
.click-box {
  position: absolute;
  top: 174px;    /* vertical position from the top of image */
  left: 828px;  /* horizontal position from the left of image */
  width: 280px;  /* width of clickable area */
  height: 36px;  /* height of clickable area */
  background-color: rgba(0, 0, 0, 0); /* fully transparent */
  z-index: 2;
  cursor: pointer;
}

/* MENU BAR */
.menu-bar {
  display: flex;
  justify-content: center;
  gap: 2px;
  width: 990px;           /* stretch to parent width */
  margin: 0 auto;        /* centers the bar horizontally */
  margin-top: 2px;
}

 .image-button {
      border: none;
      padding: 0;
      background: none;
      cursor: pointer;
      outline: none;
      transition: transform 0.1s ease, box-shadow 0.1s ease;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
      border-radius: 8px;
    }

 .image-button:active {
      transform: translateY(2px);
      box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
    }

 .image-button img {
      display: block;
      width: 240px; /* adjust as needed */
      height: 38px;
      border-radius: 0;
    }

.hover-image-button {
  position: relative;
  display: inline-block;
  width: 240px; /* same as your image size */
  height: 38px;
}

.hover-image-button img {
  position: absolute;
  top: 0;
  left: 0;
  width: 240px;
  height: 38px;
  border: none;
  padding: 0;
  margin: 0;
  display: block;
  transition: opacity 0.2s ease;
}

.hover-img {
  opacity: 0;
}

.hover-image-button:hover .hover-img {
  opacity: 1;
}

.hover-image-button:hover .default-img {
  opacity: 0;
}


/* Main container between header and footer */
.main-container {
  position: relative;
  width: 957px; /* match your header width */
  height: 1300px; /* adjust height as needed */
  margin: 0 auto;
  border: 4px solid #bdc476;
  background-color: #fafaf4;
}

/* Background Color Line to hide top border inside main container */
.main-bgcolorline {
  position: absolute;
  top: -3.75px;   /* distance from top of container */
  left: .40px; /* distance from left of container */
  width: 956.3px;  /* adjust as needed */
  height: 4px;  /* maintains aspect ratio */
}

/* Background Color Line to hide top border inside main container */
.main-bluecolorline {
  position: absolute;
  top: -3.75px;   /* distance from top of container */
  left: -4px; /* distance from left of container */
  width: 965px;  /* adjust as needed */
  height: 2px;  /* maintains aspect ratio */
}

/* 911 disclaimer inside main container */
.movable-box911 {
  position: absolute;
  width: 700px;
  height: 17px;
  margin: 0 auto;
  padding: 5px;
  border: 2px solid #324158;
  border-radius: 8px;
  background-color: #ffffff;
  color: #000066;
  font-size: 18px;
  top: -4px;
  left: 115px;
  /* Center text vertically & horizontally */
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

/* keeps spaces between bold words */
.movable-box911 b {
  margin-left: 4px;
  margin-right: 3px;
  color: #000000;
}


/* 988 disclaimer inside main container */
.movable-box988-under911 {
 position: absolute;
  width: 200px;
  height: 17px;
  margin: 0 auto;
  padding: 5px;
  border: 2px solid #324158;
  border-radius: 8px;
  background-color: #ffffff;
  color: #000066;
  font-size: 18px;
  top: 25px;
  left: 375px;
  /* Center text vertically & horizontally */
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

/* keeps spaces between bold words */
.movable-box988-under911 b {
  margin-left: 4px;
  margin-right: 3px;
  color: #000000;
}

/* about ashley title image inside main container */
.main-aatitleimage {
  position: absolute;
  top: 98px;   /* distance from top of container */
  left: 15px; /* distance from left of container */
  width: 158px;  /* adjust as needed */
  height: 40px;  /* maintains aspect ratio */
  border-radius: 0; /* optional: rounded corners */
}

/* profile photo inside main container */
.main-profilephoto {
  position: absolute;
  top: 144px;   /* distance from top of container */
  left: 640px; /* distance from left of container */
  width: 284px;  /* adjust as needed */
  height: 360px;  /* maintains aspect ratio */
  border-radius: 0; /* optional: rounded corners */
  border: 1px solid #324158;
  border-radius: 0;
}

/* about ashley text next to profile photo */
.text-block1 {
  position: absolute;
  top: 156px;
  left: 20px;
  width: 610px;
font-family: "Crimson Pro";
font-size: 19px;
color: #000066;
text-align: center;
}

/* about ashley text below profile photo */
.text-block2 {
  position: absolute;
  top: 510px;
  left: 20px;
  width: 900px;
  font-family: "Crimson Pro";
  font-size: 19px;
  color: #000066;
  text-align: center;
}

/* Dashed Line1 inside main container */
.main-dashedline1 {
  position: absolute;
  top: 755px;   /* distance from top of container */
  left: 0; /* distance from left of container */
  width: 957px;  /* adjust as needed */
  height: 5px;  /* maintains aspect ratio */
}

.movable-boxcre {
  position: relative;
  width: 620px;
  height: 165px;
  margin: 780px auto 0 auto;
  padding: 50px 30px 30px 40px;  /* Slight top padding for image space, extra left for bullets */
  border: 3px solid #bbbd72;
  border-radius: 4px;
  background-color: #fafaf4;
  font-family: "Crimson Pro";
  font-size: 19px;
  color: #000066;
  box-sizing: border-box;
}

.movable-boxcre ul {
  margin: 0;
  padding-left: 10px;  /* Ensures bullet points appear */
  list-style-type: disc;
  text-align: left;
}

.movable-boxcre li {
  margin: 10px 0;
  line-height: 1;
}

.main-cretitleimage {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  width: 148px;
  height: 31px;
  border-radius: 0;
}

.main-cam-icon {
  width: 19px;
  height: 19px;
  vertical-align: middle;
  margin-left: 1px;   /* smaller gap from the word */
  margin-right: 2px; /* pulls icons closer to each other */
}

.camera-link {
  text-decoration: none; /* gets rid of blue under link line*/
  border: none;
}



.movable-boxaff {
  position: relative;
  width: 755px;               /* match credentials box width */
  height: 190px;
  margin: 20px auto 0 auto;  /* space above, centered */
  padding: 50px 30px 30px 40px;  /* similar padding to credentials */
  border: 3px solid #bbbd72;
  border-radius: 4px;
  background-color: #fafaf4;
  font-family: "Crimson Pro";
  font-size: 19px;
  color: #000066;
  box-sizing: border-box;
  display: block;            /* no flex here unless needed */
  text-align: left; 
}

/* Affiliations title image inside the box */
.main-afftitleimage {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  width: 148px;
  height: 33px;
  border-radius: 0;
}

/* Affiliations list */
.movable-boxaff ul {
  margin: 0;
  padding-left: 10px;
  list-style-type: disc;
  text-align: left;
}

/* Affiliations list items */
.movable-boxaff li {
  margin: 10px 0;
  line-height: 1;
}

/* Arrow icons next to list items */
.main-arrow-icon {
  width: 30px;
  height: 15px;
  vertical-align: middle;
  cursor: pointer;
}


/* Dashed Line2 inside main container */
.main-dashedline2 {
  position: absolute;
  top: 1175px;   /* distance from top of container */
  left: 0; /* distance from left of container */
  width: 957px;  /* adjust as needed */
  height: 5px;  /* maintains aspect ratio */
}


/* Footer Box Container */
.movable-boxfoot {
  position: relative;
  width: 902px;
  margin: 20px auto;
  margin-top: 32px;
  padding: 12px 20px;
  background-color: #fafaf4;
  display: flex;
  justify-content: space-between;
  font-family: "Cormorant Garamond";
  color: #000000;
}

/* Left Box (inside Footer) */
.movable-boxFootLeft {
  width: 50%;
  padding-right: 10px;
  text-align: left;
  font-size: 18px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
margin-left: -14px;
}

/* Right Box (inside Footer) */
.movable-boxFootRight {
  width: 50%;
  padding-left: 10px;
  text-align: right;
  font-size: 18px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

/* Shared Styling */
.movable-boxFootLeft ul,
.movable-boxFootRight ul {
  list-style-type: none;
  padding-left: 10px;
  margin: 0;
}

.movable-boxFootLeft li,
.movable-boxFootRight li {
  margin: 4px 0;
  line-height: 1.3;
}

.movable-boxFootLeft a,
.movable-boxFootRight a {
  text-decoration: none;
  color: black;
}



/* Call Today Image inside main container */
.main-calltoday {
  position: absolute;
  top: 1216px;   /* distance from top of container */
   left: 50%; /* distance from left of container */
  transform: translateX(-50%); /* shift element left by half its width */
  width: 268px;  /* adjust as needed */
  height: 50px;  /* maintains aspect ratio */
}

/* Copyright Image BELOW main container */
.main-copyrightimage {
  position: absolute;
  top: 1570px;   /* distance from top of container */
  left: 50%; /* distance from left of container */
  transform: translateX(-50%); /* shift element left by half its width */
  width: 663px;  /* adjust as needed */
  height: 36px;  /* maintains aspect ratio */
}