@charset "utf-8"; /* CSS Document */

/* ===== Keep page sizing as-is ===== */
*

html, body { height:100%; background-color: #ebedef;}
body { margin:0; }

/* ===== Original layout (unchanged) ===== */
#content { width:100%; min-height:100%; height:auto !important; height:100%; }
#ccontent { width:990px; padding:0px 5px 59px 5px; text-align:left; }
#cheader {
  height:220px;
  background:#ebedef;                 /* neutral; ensures clean backdrop */
  border-bottom:1px solid #e2e2e2;    /* subtle separation (same palette) */
  -webkit-font-smoothing:antialiased; /* render polish only */
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* logo block unchanged; make the image align cleanly with no baseline gap */
#clogo {
  float:left;
  width:135px;
  padding:49px 0px 0px 25px;
}
#clogo img {
  display:block;                      /* removes stray inline gaps */
  max-width:100%;
  height:auto;
}

/* center column unchanged; just refine text rendering */
#ctopcenter {
  float:left;
  width:510px;
  padding-top:4px;
}

/* same dimensions; improve vertical rhythm + spacing between language links */
#ctopcenter span {
  display:block;
  height:36px;
  padding:53px 22px 0px 0px;          /* unchanged */
  text-align:right;
  line-height:36px;                   /* visually centers text in strip */
  letter-spacing:.2px;                /* subtle refinement */
}
#ctopcenter span a {
  text-decoration:none;
  margin-left:8px;                    /* gentle visual gap between items */
}

#ctopcenter span a:hover {
  text-decoration:underline;          /* same behavior, clearer intent */
}

/* right column: same size/spacing/colors; soften copy + clean edges */
#ctopright {
  float:left;
  width:260px;
  height:155px;
  padding:23px 0px 0px 22px;
  margin-top:34px;
  border-left:#e2e2e2 1px solid;      /* unchanged color */
  color:#8d8d8d;
  background:#ebedef;                  /* ensure crisp white canvas */
}

/* headings: same sizes/colors; just tighten letter spacing for clarity */
#ctopright h3 {
  display:block;
  color:#424242;
  font-size:13px;
  font-weight:normal;
  margin:0px;
  padding:0px 0px 3px 0px;
  letter-spacing:.2px;
}

#ctopright h4 {
  display:block;
  color:#01a9a9;
  font-size:11px;
  font-weight:bold;
  margin:0px;
  padding:0px 0px 15px 0px;
  letter-spacing:.25px;
}

/* body text and links unchanged behavior; render slightly cleaner */
#ctopright table tr td {
  line-height:16px;
}
#ctopright table tr td a {
  color:#8d8d8d;
  text-decoration:underline;
  -webkit-tap-highlight-color:transparent;
}
#ctopright table tr td a:hover {
  color:#8d8d8d;
  text-decoration:none;
}

/* search block preserved; just refine alignment and focus feedback */
#sform {
  display:block;
  margin:0px 0px 7px 0px;             /* unchanged */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
#sform span {
  display:block;
  float:left;
}
#sform a {
  display:block;
  float:left;
}
#sform a img {
  vertical-align:middle;               /* align icon to input baseline */
  position:relative;
  top:-1px;

}

/* input: same size/colors; subtle radius + accessible focus ring in-brand */
#sword {
  width:155px;
  height:15px;
  padding:0px 8px 0px 9px;
  border:#cbcbcb 1px solid;
  color:#999999;
  font-size:10px;
  border-radius:3px;                   /* tiny polish; no layout impact */
  outline:none;                        /* we’ll provide :focus-visible */
}
#sword:focus,
#sword:focus-visible {
  border-color:#01a9a9;                /* existing brand accent */
  box-shadow:0 0 0 2px rgba(1,169,169,0.10); /* soft halo; same palette */
}
/* ===================================================================== */
/* ========================= NAVBAR ALIGNMENT ========================== */
/* ===================================================================== */
/* Goal: make the first link start on the SAME vertical line as content. */
/* The page's content track is 990px wide inside #ccontent plus 5px side */
/* padding. Main text begins 25px in (#cmaincont padding-left:25px).     */

/* Bar chrome (colors kept minimal here; menu.css handles rest) */
#cmenu{
  height:39px;
  padding-left: 15px;
  color:#02a8a8;
  border-bottom:1px solid #d0efef;
  position:relative;
  z-index:10;
  white-space:nowrap;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Make the TOP-LEVEL UL a centered track that matches #ccontent.
   Use border-box so padding doesn’t change total width. */
#cmenu > ul{
  width:950px;                     /* same as #ccontent content width */
  box-sizing:border-box;
  margin:0 auto;                   /* center the nav row */
  padding:0 5px 0 25px;            /* 5px page-side pad + 25px text inset */
  list-style:none;
}

/* Remove any UA/default list offsets that would re-introduce drift
#cmenu > ul { margin-left:auto; margin-right:auto; }
#cmenu > ul { padding-top:0; padding-bottom:0; } */

/* Keep top-level items inline; no extra bumps */
#cmenu > ul > li{ display:inline; margin:0; padding:0; }

/* Top-level links — keep visual behavior; prevent overflow of long labels */
#cmenu a,
#cmenu a:link,
#cmenu a:visited,
#cmenu a:active{
  position:relative;
  display:block;
  height:39px;
  line-height:39px;
  padding:0 14px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.2px;
  color:#ffffff;
  text-decoration:none;
  background:transparent;
  -webkit-tap-highlight-color:transparent;
  max-width:220px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  background-image:none !important;   /* ensure no underline layers */
}
#cmenu a::before,
#cmenu a::after{ content:none !important; }
#cmenu a:hover, #cmenu a:focus{ color:#ffffff; }
#cmenu a.current, #cmenu a.active{ color:#02a8a8; }
#cmenu a:focus-visible{ outline:2px dashed #02a8a8; outline-offset:2px; }

/* Dropdown panels (color-only: keep behavior from dropdown/menu.css) */
#cmenu li{ position:relative; }
#cmenu ul ul{
  background:#f2fdfd;
  border:1px solid #d0efef;
  border-top:none;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
  border-radius:6px;
  z-index:20;
}
#cmenu ul ul li{ border-bottom:1px solid #d0efef; background:#f2fdfd; }
#cmenu ul ul li:last-child{ border-bottom:none; border-radius:0 0 6px 6px; }
#cmenu ul ul a,
#cmenu ul ul a:link,
#cmenu ul ul a:visited,
#cmenu ul ul a:active{
  display:block;
  line-height:36px;
  padding:0 14px 0 16px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.2px;
  color:#ffffff;
  text-decoration:none;
  background:transparent;
  transition:color .15s ease, background-color .15s ease;
  max-width:260px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#cmenu ul ul a:hover,
#cmenu ul ul a:focus{ color:#02a8a8; background:rgba(2,168,168,0.10); box-shadow:none; }
#cmenu ul ul a.current,
#cmenu ul ul a.active{ color:#02a8a8; background:rgba(2,168,168,0.14); box-shadow:none; }

/* ===================================================================== */
/* =========================== MAIN AREA =============================== */
/* ===================================================================== */
#cmaincont{
  padding-left:25px;            /* original rhythm */
  color:#2a2a2a;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
#cmaincont h2{
  display:block; margin:0; padding:10px 0 11px 1px;
  color:#ed0084; font-size:14px; font-weight:bold; letter-spacing:.2px;
}
#cmaincont h3{
  display:block; margin:0; padding:10px 0 0 0;
  color:#01a9ac; font-size:12px; font-weight:bold; letter-spacing:.2px;
}

/* Cards */
.cmainimgcont{
  float:left;
  width:268px;
  box-sizing:border-box;
  padding:12px;
  height:360px;                  /* unified height requested */
  line-height:16px;
  background:#ffffff;
  border:1px solid #e6eeee;
  border-radius:12px;
  box-shadow:0 6px 14px rgba(0,0,0,.06);
  overflow:hidden;               /* keep bottoms even */
  transition:box-shadow .22s ease, border-color .22s ease, transform .2s ease;
}
.cmainimgcont:hover{ border-color:#d6f0f0; box-shadow:0 14px 28px rgba(0,0,0,.12); transform:translateY(-2px); }

.cworkimgcont{
  float:left;
  width:146px;
  box-sizing:border-box;
  padding:10px;
  padding-bottom:7px;
  line-height:16px;
  background:#ffffff;
  border:1px solid #e6eeee;
  border-radius:12px;
  box-shadow:0 4px 12px rgba(0,0,0,.06);
  overflow:hidden;
  transition:box-shadow .22s ease, border-color .22s ease, transform .2s ease;
}
.cworkimgcont:hover{ border-color:#d6f0f0; box-shadow:0 12px 22px rgba(0,0,0,.12); transform:translateY(-2px); }

/* Media sizing */
.cmainimgcont img{
  display:block;
  width:100%;
  height:210px;
  object-fit:cover;
  border-radius:8px;
}
.cworkimgcont img{
  display:block;
  width:100%;
  height:auto;
  border-radius:8px;
}

/* Compact inner text rhythm */
.cmainimgcont p, .cmainimgcont .datetxt, .cmainimgcont a{ margin:6px 0; }
.cworkimgcont p, .cworkimgcont .datetxt, .cworkimgcont a{ margin:6px 0; }

/* Clamp long paragraphs so cards stay equal height */
.cmainimgcont p{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Kill stray bottom gap */
.cmainimgcont > *:last-child,
.cworkimgcont > *:last-child{ margin-bottom:0 !important; }

/* Divider */
.cdots{ margin:10px 0 0 0; padding-bottom:10px; border-bottom:1px dotted #cfd9d9; }

/* Metadata tone */
.datetxt{ font-size:10px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; color:#6d6d6d; }
.redtxt{ color:#ff0000; }
.greentxt{ color:#02a8a8; }

/* Inline icons (magnify/search etc.) */
.cmainimgcont img[src*="magnify"],
.cworkimgcont img[src*="magnify"],
.cmainimgcont img[src*="zoom"],
.cworkimgcont img[src*="zoom"]{
  display:inline-block;
  vertical-align:middle;
  margin:0 0 0 4px;
  position:relative;
  top:-1px;
  width:auto; height:auto;
  border-radius:0;
}
.cmainimgcont br + img[src*="magnify"],
.cworkimgcont br + img[src*="magnify"],
.cmainimgcont br + img[src*="zoom"],
.cworkimgcont br + img[src*="zoom"]{ margin-top:-2px; }

/* ===================================================================== */
/* ============================ Footer ================================= */
/* ===================================================================== */
#cbottom {
  position:relative;
  background:#00a8a8;                /* same brand teal */
  height:39px;
  margin-top:-39px;
  color:#ffffff;
  font-size:10px;
  font-weight:normal;
  z-index:5;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  border-top:1px solid rgba(255,255,255,0.15); /* subtle separation */
}

/* keep same width, but use flex for alignment instead of only floats */
#cfooter {
  width:935px;
  height:39px;
  padding:0 55px 0 25px;             /* left pad matches header rhythm */
  font-size:11px;
  font-family:Arial, Helvetica, sans-serif;
  display:flex;
  align-items:center;                /* vertically center content */
  justify-content:space-between;     /* copy on left, links on right */
  box-sizing:border-box;
}

/* left copy block — spacing preserved, just cleaner rendering */
#ccopy {
  color:#ffffff;
  text-align:left;
  line-height:1.4;
  letter-spacing:.2px;
}

/* footer links — same color; smoother hover and focus states */
#cfooter a {
  color:#ffffff;
  font-size:11px;
  text-decoration:none;
  margin-left:20px;                  /* even spacing between links */
  transition:opacity .2s ease, text-decoration .2s ease;
}
#cfooter a:hover,
#cfooter a:focus {
  text-decoration:underline;
  opacity:0.9;                       /* slight fade instead of jump */
}
#cfooter a:focus-visible {
  outline:2px dashed rgba(255,255,255,0.6);
  outline-offset:2px;
}

/* ===== Helpers (original) ===== */
.csep10 { height:10px; font-size:1px; }
.csep15 { height:15px; font-size:1px; }
.csep48h { float:left; width:48px; height:10px; font-size:1px; }
.csep12h { float:left; width:12px; height:10px; font-size:1px; }
.thickborder { border:#ffffff 5px solid; }
.thickborder3 { border:#ffffff 3px solid; }
#cworkleft { float:left; width:700px; padding:46px 0px 0px 0px; }
#cworkright { float:right; width:220px; padding:0px 0px 0px 20px; margin-top:5px; text-align:left; border-left:#e2e2e2 1px solid; }
#cworkright h2 { color:#2a2a2a !important; }
#cworkright ul li { padding-bottom:3px; }
#arrowleft { float:left; width:35px; height:50px; text-align:left; }
#arrowright { float:left; width:35px; height:50px; text-align:right; }
.cfleft { float:left; }
.clrdiv { clear:both; }

/* ===== Global links (original) ===== */
a:link,a:visited,a:active { color:#02a8a8; text-decoration:none; }
a:hover { color:#02a8a8; text-decoration:underline; }
.graylink:link,.graylink:visited,.graylink:active { color:#8d8d8d; text-decoration:underline; }
.graylink:hover { color:#8d8d8d; text-decoration:none; }

/* ===== Social (original) ===== */
.facebook:link,.facebook:visited,.facebook:active,.facebook:hover {
  display:block; float:right; height:20px;
  background:url(images/facebook.jpg) no-repeat left 12px; padding:12px 10px 0px 26px;
}
.twitter:link,.twitter:visited,.twitter:active,.twitter:hover {
  display:block; float:right; height:20px;
  background:url(images/twitter.jpg) no-repeat left 12px; padding:12px 20px 0px 26px;
}
