@charset "utf-8";

/* =========================
   CSS Reset / Base Normalize
========================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

img {
    display: block;
    border: 0;
}

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

body {
    font-family: Arial, Helvetica, sans-serif;
    background: #ffffff;
    color: #333;
	 margin: 0 auto;        /* centers the body */
    max-width: 1003px;     /* old template width */
    min-width: 1003px;     /* optional if you want fixed width */
}

/* =========================
   Page Container
========================= */
#page {
    width: 1003px;
    margin: 0 auto;
    overflow: hidden; /* contains floats if any legacy code exists */
}

/* =========================
   Top Banner
========================= */
#top-banner {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    background: transparent;   /* removed deep blue */
    padding: 10px 0;
}

/* Logo */
#logo {
    width: 230px;
    display: flex;
    align-items: flex-end;
}

#logo img {
    display: block;
}

/* Right side (language + nav) */
#right-top {
    width: 773px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

/* Language bar */
#language,
#language-options {
    font-size: 12px;
    margin-bottom: 4px;
    color: #333;
}

#language a,
#language-options a {
    color: #333;
    text-decoration: none;
}

#language a:hover,
#language-options a:hover {
    text-decoration: underline;
}

/* Navigation image */
#nav,
#nav-banner {
    width: 773px;
}

#nav img,
#nav-banner img {
    display: block;
    width: 773px;
    height: auto; /* prevents stretching */
}

/* =========================
   Middle Content Area
========================= */
#content,
#main-content {
    display: flex;
    width: 100%;
    background: transparent;
}

/* Left Column / Menu */
#left-column,
#left-menu {
    width: 199px;
    margin: 0;
     /* or whatever you want */
    background: #f0f0f0;
    padding: 0px;
}

#left-menu ul {
    list-style: none;
	margin: 10px;
}

#left-menu li {
    margin-bottom: 10px;
}

#left-menu a {
    text-decoration: none;
    color: #333;
}

#left-menu a.active {
    font-weight: bold;
    color: #004080;
}

#left-menu img.left-menu-banner {
    display: block;     /* removes inline gaps */
    width: 100%;        /* stretches to column width */
    height: auto;       /* preserves aspect ratio */
    margin: 0;
    padding: 0px;
}


/* Right Column / Content */
#right-column,
#right-content {
    width: 804px;
    padding: 0px;
}


/* =========================
   Footer / Bottom Banner
========================= */
#footer,
#bottom-banner {
    width: 100%;
    text-align: center;
    font-size: 12px;
    padding: 10px 0;
    background: #f2f2f2;
    color: #333;
    border-top: 1px solid #ccc;
}

#bottom-banner a {
    color: #333;
    text-decoration: none;
    margin: 0 10px;
}

#bottom-banner a:hover {
    text-decoration: underline;
}

/* =========================
   Right Decoration Area
========================= */
#right-decor {
    margin-bottom: 10px;
}

/* Banner image */
.right-banner img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

/* Breadcrumb */
.breadcrumb {
    font-size: 12px;
    color: #333;
    margin: 8px 0;
}

.breadcrumb a {
    color: #006699;
    text-decoration: none;
}

.breadcrumb a:hover {
    text-decoration: underline;
}

.breadcrumb-sep {
    margin: 0 5px;
}



/* Separator line */
.content-separator {
    border: none;
    border-top: 1px solid #006699;
    margin: 10px 0 15px 0;
}

.why-us {
    margin: 30px; /* Adds 30px margin on all sides */
}

.breadcrumb {
    margin: 10px 0;       /* 10px vertical margin, 0 horizontal */
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #000000;
}
 .breadcrumb {
    display: flex;
    align-items: center;
    gap: 6px;
}



.breadcrumb a,
.breadcrumb span {
    display: inline-block;  /* keeps elements inline but allows spacing */
    vertical-align: middle;
}

.breadcrumb .breadcrumb-sep {
    margin: 0 5px;  /* optional spacing around separator for clarity */
}