/*
 Theme Name:   Divi Child
 Theme URI:   https://43.220.2.147/divi-child/ (replace with your site URL)
 Description:  Custom Child Theme for Divi (add your own description here)
 Author:       Your Name (your name or business name)
 Author URI:   https://43.220.2.147/ (your website URL)
 Template:     Divi
 Version:      1.0.0
 Text Domain:  Divi-child
*/

/* === Your Custom CSS Goes Below This Line === */
/* Example: Change Divi's default body font size */

        /* Paste ALL your top-menu CSS from the original HTML here (full style block for top-menu) */
body {
          box-sizing: border-box;
          min-height: 100%;
}
        
        * {
          margin: 0;
          padding: 0;
          box-sizing: border-box;
        }

        html, body {
          /*height: 100%; fixed vertical scrool bar issue 19mar*/
          font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
          overflow-x: hidden;
        /*overflow-y: hidden;  disable Vertical scroll */
          font-size: 18px;
          color: #333
        }


/* Korean font "Nanum Gothic" worked @ 26 Jan*/
html[lang="ko"] body {
  font-family: "Nanum Gothic";
}
/* vi, id font 28Jan*/
html[lang="vi"] body {
  font-family: "Roboto";
}
html[lang="id"] body {
  font-family: "Arial";
}

.atw-lang-switcher {
  width:124px;
}
.atw-lang-switcher a {
  font-size: 15px;
}
/* Optional: Target specific elements (e.g., headings) 
html[lang="zh-CN"] h1,
html[lang="zh-CN"] h2 {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
*/

h1 {
    font-size: 48px!important;
    font-weight: bold;
    margin-bottom: 1.5rem;
    color: rgb(157, 50, 146);
}

  h2 {
    font-size: 34px!important;
  font-weight: bold!important;
    margin-bottom: 1rem;
    color: rgb(157, 50, 146);
}
  h3 {
    font-size: 28px!important;
    margin-bottom: 1rem;
    color: rgb(157, 50, 146);
}
  h4 {
    font-size: 26px!important;
    margin-bottom: 1rem;
    color: rgb(157, 50, 146);
}
  h5 {
    font-size: 24px!important;
    margin-bottom: 1rem;
    color: rgb(157, 50, 146);
}
  h6 {
    font-size: 22px!important;
    margin-bottom: 1rem;
    color: rgb(157, 50, 146);
}
        /* Top menu Banner Bar */
        .top-menu {
          position: fixed;
          top: 0;
          left: 0;
          right: 0;
          background: rgba(255, 255, 255, 0.95);
          z-index: 1001;
          font-size: 18px;
          font-weight: 500;
          width: 100%;
        }
h1, h2, h3, h4, h5, h6{
    line-height: 1.2em;
}
/* site content class starts */
.site {
        padding-top: 160px!important;
        }
.site p {
        font-size: 18px;
        color: #333
        } 
/* list items 13feb*/
.site ul, .site ul li {
        font-size: 18px;
        color: #333
        }
/* table items 16feb*/
.site table, .site table td {
        font-size: 18px;
        color: #333
        }

  .top-banner  {
    /*padding-right: 65px;*/
    padding-top:10px;
    height: 110px;
    position: relative;
    width: 100%;
    background-color: #fff;
}


    .top-banner-content {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      padding: 0.4rem;
      gap: 2rem;
      width: 100%;
      margin-bottom:1rem;
    }

    .top-banner-link {
      color: #114E87;
      text-decoration: none;
      padding: 0.3rem 0.5rem;
      border-radius: 4px;
      transition: all 0.3s ease;
      display: flex;
      align-items: center;
      gap: 0.4rem;
      white-space: nowrap;
      font-weight: bold;
    }

    .top-banner-link:hover {
      color: #667eea;
      background: rgba(102, 126, 234, 0.1);
      transform: translateY(-1px);
    }

    .top-banner-link svg {
      width: 14px;
      height: 14px;
      fill: darkred;
    }

    /* Make search input box wider and in one line */
    .top-banner-search {
      display: flex;
      align-items: center;
      background: rgba(102, 126, 234, 0.1);
      border-radius: 20px;
      padding: 0.3rem 0.6rem;
      transition: all 0.3s ease;
      min-width: 200px;
      width: 180px;
    }

    .top-banner-search:hover {
      background: rgba(102, 126, 234, 0.15);
    }

    .top-banner-search-input {
      border: none!important;
      background: transparent;
      color: #666;
      outline: none;
      width: 150px;
      font-size: 13px;
      padding: 0.2rem;
    background-color: transparent!important;
    }

    .top-banner-search-input::placeholder {
      color: rgba(102, 126, 234, 0.7);
    }

    .top-banner-search-btn {
      background: none;
      border: none;
      cursor: pointer;
      padding: 0.2rem;
      display: inline-block;
      align-items: center;
      transition: transform 0.3s ease;
    }

    .top-banner-search-btn:hover {
      transform: scale(1.1);
    }

    .top-banner-search-btn svg {
      width: 14px;
      height: 14px;
      stroke: #667eea;
    }



    .logo-link {
      display: flex;
      align-items: center;
      text-decoration: none;
      transition: transform 0.3s ease;
    }

    .logo-link:hover {
      transform: scale(1.05);
    }

    .logo-link img {
      width: 98px;
      transition: height 0.3s ease;
      min-width: 96px;
    }


    .dropdown {
      position: relative;
    }

    .dropdown:hover .dropdown-content{
      opacity: 1;
      visibility: visible;
      top: 0;
    }

    .dropdown-content {
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      background: rgba(255, 255, 255, 0.98);
      backdrop-filter: blur(10px);
      width: auto;
      white-space: nowrap;
      border-radius: 12px;
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
      opacity: 0;
      visibility: hidden;
      transition: all 0.3s ease;
      padding: 0.5rem 0;
      z-index: 1001;
    }

    .dropdown-content::before{
      content: '';
      position: absolute;
      top: -10px;
      left: 50%;
      transform: translateX(-50%);
      width: 0;
      height: 0;
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-bottom: 10px solid rgba(255, 255, 255, 0.98);
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    .dropdown:hover .dropdown-content::before  {
      opacity: 1;
    }

    .dropdown-content a {
      display: block;
      padding: 0.6rem 1.5rem;
      color: #333;
      transition: all 0.3s ease;
      white-space: nowrap;
    }
/* main menu - sub menu dropdown items 13feb */
    #header .sub-menu a {
      display: block;
      padding: 0.3rem 1rem;
      color: #333;
    }

    .dropdown-content a::after {
      display: none;
    }

    .dropdown-content a:hover {
      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
      color: white;
      border-radius: 0px;
      text-align: center;
    }



/* sub menu css*/
 .dropdown {
      position: relative;
    }

    /* Only open the direct child submenu on hover (prevents ancestor hover opening nested submenus) */
    .dropdown:hover > .dropdown-content {
      opacity: 1;
      visibility: visible;
      top: calc(100% + 15px);
    }

    /* Nested submenu: collapsed by default, opens on hover of its parent item (desktop) */
    .dropdown > .dropdown {
      position: relative;
    }
    .dropdown-content > .dropdown > .dropdown-content {
      position: absolute;
      top: 0;
      left: 100%;
      transform: translateX(8px);
      background: rgba(255, 255, 255, 0.98);
      backdrop-filter: blur(10px);
      min-width: 200px;
      white-space: nowrap;
      border-radius: 12px;
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
      opacity: 0;
      visibility: hidden;
      transition: all 0.18s ease;
      padding: 0.5rem 0;
      z-index: 1010;

    }
    .dropdown-content > .dropdown:hover > .dropdown-content {
      transform: translateX(0);
      opacity: 1;
      visibility: visible;
    }
/* wp top header menu 3 Jan 2026*/
header {
    position: relative;
    background-color: rgb(157, 50, 146);
}
/* 1. Clear default browser styles & resolve potential Tailwind conflicts */
nav {
  display: flex;
  background-color: rgb(157,50,146); /* Top menu background color (customizable) */
    justify-content: space-between;
    align-items: center;
    max-width: 1000px;
    margin: 0 auto;
}

/* Remove default list bullets for all menu ul */
.nav-links, .sub-menu {
  list-style: none;
}

/* Remove default link underline */
nav a {
  text-decoration: none;
}

/* 2. Top menu - Horizontal layout for top-level item, nav menu left margin 10Jan */
.nav-links {
  display: flex;
  gap: 0; 
  background-color: rgb(157,50,146); 
 padding-left: 50px;
} 

/*  menu items active effect*/
.nav-links .current-menu-item {
    color: #fff;
    font-weight: bold;
    background: rgb(255, 166, 0);
}

/* 3. Parent item positioning (critical for absolute submenu positioning) */
/* Apply to top-level menu items (e.g., About Us) and Goverance (submenu item with children) */
.menu-item {
  position: relative;
  padding: 15px 20px; /* Vertical/Horizontal padding for clickable area (customizable) */
}

/* 4. Default hide ALL sub-menus (collapse by default) */
.sub-menu {
  display: none;
  position: absolute;
  background-color: rgb(255, 254, 253); /* 1st level submenu background (customizable) */
  min-width: 220px; /* Minimum width of submenu (customizable) */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Soft shadow for layering */
  z-index: 999; /* Ensure submenu is above other content */
  border-radius: 12px;
}

/* 5. Style for submenu items (Goverance, Our Organisation, Annual Reports, AGM) */
.sub-menu .menu-item {
  padding: 1px 15px; /* Smaller padding for submenu items (customizable) */
  border-bottom: 1px dotted #4a6583; /* Separator between submenu items (optional) */
  white-space: nowrap; /* Prevent submenu text from wrapping */
}

/* Remove border for last submenu item (cleaner look) */
.sub-menu .menu-item:last-child {
  border-bottom: none;
}

/* 6. 1st level submenu positioning (under About Us) */
/* Align submenu directly below About Us */
.menu-item-has-children > .sub-menu {
  top: 100%; /* Align to the bottom of parent menu item */
  left: 0; /* Align to the left of parent menu item */
  flex-direction: column; /* Vertical layout for submenu items */
}

/* 7. Show 1st level submenu (Goverance + Our Organisation) when hovering About Us */
/* Use > to target direct child sub-menu (avoids style leakage) */
.menu-item-has-children:hover > .sub-menu {
  display: flex; /* Show submenu on hover */
}

/* 8. 2nd level submenu (Annual Reports + AGM under Goverance) styling & positioning */
/* Target the sub-menu inside Goverance (nested sub-menu) */
.menu-item-has-children .menu-item-has-children > .sub-menu {
  top: 0; /* Align to the top of Goverance item */
  left: 100%; /* Align to the right of Goverance item (avoid overlapping) */
  background-color: rgb(255, 254, 253);; /* Distinct background for 2nd level (customizable) */
  min-width: 200px; /* Slightly narrower than 1st level (customizable) */
}

/* 9. Show 2nd level submenu when hovering Goverance */
.menu-item-has-children .menu-item-has-children:hover > .sub-menu {
  display: flex; /* Show Annual Reports/AGM on Goverance hover */
}

/* 10. Text styling for menu links (customizable colors) */
/* Top-level menu links */
#navLinks > .menu-item > a {
  color: #ffffff; 
  font-size: 18px;
  font-weight: bold;
  transition: color 0.3s ease;  Smooth hover transition 
}


/* 11. Hover effects for better interactivity */
/* Top menu item hover (text color change) */
#navLinks > .menu-item:hover {
    font-weight: bold;
    background: rgb(255, 166, 0);
}

/* Submenu item hover (background + text color change) */
.sub-menu .menu-item:hover {
      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
      color: white;
}

.sub-menu .menu-item:hover > a,
.sub-menu .menu-item > a:hover {
  color: white; /* Light blue on hover (customizable) */
}

/* 12. Optional: Responsive design for mobile screens (≤768px) */
@media (max-width: 768px) {
  /* Switch top menu to vertical layout */
  .nav-links {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  } 

  /* Adjust submenu positioning for mobile (avoid off-screen display) */
  .menu-item-has-children > .sub-menu,
  .menu-item-has-children .menu-item-has-children > .sub-menu {
    position: relative;
    top: 0;
    left: 0;
    margin-top: 10px;
    margin-left: 15px; /* Indent submenus for hierarchy visibility */
    width: 100%;
  }
}

/* Base Styles main menu */

/* Base Menu Styles */
.primary-menu-container {
  width: 100%;
}

/* Mobile Toggle Button */
.mobile-menu-toggle {
  display: none;
  background: none;
  border: none;
  font-size: 38px;
  cursor: pointer;
  padding: 10px 15px;
  margin: 0 0 15px 0;
  color: #9D3232;
  /* Mobile only - hide on desktop */
}

/* Main Menu List (nav-links) */
#navLinks.nav-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: none; /* Hidden by default on mobile */
  flex-direction: column;

  border-top: 1px solid #eee;
}

/* Show menu when active (mobile) */
#navLinks.nav-links.active {
  display: flex;
}

/* Menu Items */
#navLinks.nav-links > li {
  position: relative;
  padding: 10px 15px;
  border-bottom: 1px solid #eee;
}

/* Menu Links */
#navLinks.nav-links a {
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  display: block;
}

/* Hover state for links */
#navLinks.nav-links a:hover {
  color: #fff;
}

/* Sub-menu Styles (all levels) */
#navLinks.nav-links .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: none;
  margin-left: 15px;
  background-color: #f9f9f9;
  color:#333;
}
/* Submenu links (Goverance, Our Organisation, etc.) */
#navLinks.nav-links .sub-menu .menu-item > a {
  color: #333; /* Light gray text for submenus */
  transition: color 0.3s ease;
  font-weight: 500;
}

/* Show sub-menu when parent is active */
#navLinks.nav-links li.menu-item-has-children.active > .sub-menu {
  display: block;
}

/* sub-menu hover item style*/
#navLinks.nav-links .sub-menu:hover,
#navLinks.nav-links .sub-menu .menu-item > a:hover {
  color:#fff;
}
/* mobile Styles (below 768px ) */
@media (max-width: 767px) {
  /* Hide mobile toggle button on desktop */
  .mobile-menu-toggle {
    display: block;
  }
}
/* Desktop Styles (768px and above) */
@media (min-width: 768px) {
  /* Hide mobile toggle button on desktop */
  .mobile-menu-toggle {
    display: none;
  }

  /* Horizontal desktop menu */
  #navLinks.nav-links {
    display: flex;
    flex-direction: row;
    background: none;
    border: none;
  }

  #navLinks.nav-links > li {
    border: none;
    padding: 12px 25px;
  }

  /* Desktop dropdown positioning */
  #navLinks.nav-links .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    margin-left: 0;
    z-index: 1000;
  }

  /* Nested sub-menus (2nd level) */
  #navLinks.nav-links .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }

  /* Show sub-menu on hover (desktop) */
  #navLinks.nav-links li.menu-item-has-children:hover > .sub-menu {
    display: block;
  }
}



/* wp top header menu 2026*/

    /* Footer Core Styles */
        .footer-bg {
            border-top: 3px solid #ee1c26;
            color: #333;
            font-size: 18px;
      }

        .footer-inner {
            background-color: #f8f9fa;
            margin: 0 auto;
            padding: 3rem 5%;
        }
        .footer-top {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: 2rem;

        }
        .footer-brand, .footer-contact, .footer-social {
            flex: 1;
            min-width: 200px; /* Ensure mobile responsiveness */
        }
        .footer-brand { padding-left: 20px; }
        .footer-brand .newsletter { width: 300px; }

        .footer-logo {
            height: 80px;
            width: 98px;
        }
        .footer-contact p, .footer-social h3 {
            font-weight: 600;
            margin-bottom: 0.8rem;
            font-size: 1rem;
        }
        .address {
            font-style: normal;
            line-height: 1.6;
        }
        /* Social Media Icons */
          .footer-social {
            padding-left: 20px;
        }
        .social-links {
            display: flex;
            gap: 1rem;
            align-items: center;
        }
        .social-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border-radius: 4px;
            background: #fff;
            color: #e67e22; /* Matches your orange icon color */
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
            transition: background 0.2s ease;
            text-decoration: none;
        }
        .social-link:hover {
            background: #f5f5f5;
        }
        .social-link svg {
            width: 20px;
            height: 20px;
        }
        /* Footer Bottom */
        .footer-bottom {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: center;
            gap: 2rem;
            font-size: 0.9rem;
            background-color: #785679;
            padding: 10px 5%;
            color: #fff;
        }
        .footer-bottom .links {
            display: flex;
            gap: 1.5rem;
        }
        .footer-bottom a {
            color: #fff;
            text-decoration: none;
        }
        .footer-bottom a:hover {
            text-decoration: underline;
        }


    /* footer newsletter */
    .bg-primary {
        --tw-bg-opacity: 1;
        background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    }
.fa-send:before, .fa-paper-plane:before {
    content: "\f1d8";
    color: white;
}

   /* social */
    .social-icon {
      padding: 0;
      text-align: center;
      transition: all 0.3s ease;
    
      position: relative;
      overflow: hidden;

      width: 377px;

    }

.fa-phone:before {
    content: "\f095";
    font-size: 20px;
}
.fa-map-marker:before {
    content: "\f041";
    font-size: 25px;
}
.fa-clock-o:before {
    content: "\f017";
    font-size: 25px;
}
.footer-contact-h4,.footer-connect {
  color: #9d3292;
  font-size: 1.25rem
}

.footer-connect {
  padding-left: 10px;
}

.cass-reward {
  display:inline-flex;
  width:390px;
  margin-top:5px;
  margin-left:10px;
}

/*newsletter 27feb */
.news-flex {
	display: flex;
}
.news-flex input {
	width: 100%!important;
	 border-bottom-right-radius: 0rem!important;
	border-top-right-radius: 0rem!important;
	 border-top-left-radius: 0.5rem!important;
    border-bottom-left-radius: 0.5rem!important;
	padding: 8px 12px!important;
}
.news-flex  .wpcf7-response-output {
    margin: 4em 0.5em 1em!important;
    padding: 0.2em 1em;
    border: 2px solid #00a0d2;
    position: absolute;
}
/*newsletter 27feb */