@charset "utf-8";
/* LOD Global CSS Document Styles */

/* Before applying the CSS styles on a page, please select the correct layout on the advanced tab under the appearance section. In the appearance section, make sure that your chosen layout is "full width." Additionally, you should add the correct CSS page style sheet at the bottom that points to the "lod-global-css.css" style sheet. */

/*  Increase font size of main menu dropdown text    */
.otnav li a
    {
       font-size: 1.6rem;
    }
	
.skin-footer-banner a, .skin-footer-banner a:hover, .skin-footer-banner a:visited {color: #ffffff !important;}

	@media screen and (min-width: 1024px) {
.force-mobile.header-inset .otnav ul li a {
    font-size: 1.6rem;
   }
}

blockquote, blockquote footer {
	color: #696969;
}

@media screen and (max-width: 767px) {
      
    .nav-main {
  height: 75vh; /* 75% of the viewport height */
  max-height: 75vh; /* Ensure it doesn't exceed 75% */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* For iOS */
  scrollbar-width: thin; /* For Firefox */
  -ms-overflow-style: -ms-autohiding-scrollbar; /* For Edge */
  padding: 0.5rem 0; /* Add some padding for touch targets */
  position: relative; /* Ensure proper stacking context */
  z-index: 1000; /* Prevent content from appearing above dropdown */
  overscroll-behavior: contain; /* Prevent scroll chaining on mobile */
  touch-action: pan-y; /* Optimize for vertical touch actions */
  width: 100%; /* Take full width of its container */
}

.nav-main::-webkit-scrollbar {
        display: none; /* Chrome, Safari, Opera */
    }
    
    .nav-main {
        -ms-overflow-style: none;  /* IE and Edge */
        scrollbar-width: none;  /* Firefox */
    }

/* Make touch targets larger for mobile */
.nav-main a {
  padding: 0.75rem 1rem;
  min-height: 44px; /* Apple's recommended minimum touch target size */
  display: block;
}

.nav-main li {
    position: relative;
    margin: 0;
    padding: 0;
  }
  } 

  /* Tablet-only media query */
@media screen and (min-width: 768px) and (max-width: 1366px) {
    .nav-main {
        max-height: 60vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        /* scrollbar-width: thin; For Firefox  */
        padding: 0.75rem 0;
        position: relative;
        z-index: 1000;
        touch-action: pan-y; /* Optimize for vertical touch actions */
    }

    .nav-main::-webkit-scrollbar {
        display: none; /* Chrome, Safari, Opera */
    }
    
    .nav-main {
        -ms-overflow-style: none;  /* IE and Edge */
        scrollbar-width: none;  /* Firefox */
    }

        /* Make list items fully clickable */
        .nav-main li {
        position: relative;
        margin: 0;
        padding: 0;
    }

    .nav-main a {
        padding: 0.85rem 1.25rem;
        min-height: 48px;
        display: block;
        width: 100%;
        height: 100%;
        position: relative;
        
    }

}