/* ====== Base / Reset ====== */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body {
  background-color: #4D8CCB !important;   /* force same light blue as index page */
  font-family: Verdana, Arial, Helvetica, sans-serif;
  color: #000033;
}


a{color:#000033;text-decoration:none}
a:hover{color:#003399;text-decoration:underline}

.site-wrap{min-width:300px}
.container{width:100%;max-width:1000px;margin:0 auto}

/* ====== Header ====== */
.header{background:#000032}
.header .block,
.header .nav-row{line-height:0;font-size:0;text-align:center}
.header img{border:0;vertical-align:middle}
.header .hero{display:block;width:100%;height:auto}

/* ====== Content ====== */
/* Keep the page background blue; only the centered container is white */
.content{background:transparent;}
.content > .container {
  background: rgba(255, 255, 255, 0.95); /* 95% white, 5% see-through */
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.1),
              0 4px 12px rgba(0, 0, 0, 0.25);
  border-radius: 6px;
}


.tabs-row{display:flex;gap:0;padding:10px 10px 0}
.tabs-row .tab{flex:1}
.tabs-row .tab img{max-width:100%;height:auto;display:block}

.main{display:flex;gap:20px;padding:14px 10px 24px}
.left{flex:0 0 330px}
.mid{flex:0 0 170px}
.right{flex:1 0 0}

/* Sidebar */
.sidebar{background:#E9EDF5;border-radius:6px;padding:10px}
.sidebar ul{margin:0 0 12px 18px;padding:0}
.sidebar li{margin:6px 0}

/* Middle graphics */
.mid img{display:block;margin:0 auto 8px;max-width:100%}

/* Contact card */
.card{background:#fff;border:1px solid #E0E6F0;border-radius:8px;padding:18px 22px;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.card h2{margin:0 0 12px 0;font-size:20px;color:#000033}
.form-row{margin-top:10px}
.form-row label{display:block;font-size:12px;font-weight:bold;margin-bottom:4px}
.form-row input,.form-row textarea{width:100%;padding:8px;border:1px solid #BFC9DC;border-radius:4px;font-size:12px}
.form-actions{margin-top:14px}
.btn{background:#2284d5;color:#fff;border:0;padding:9px 16px;border-radius:4px;cursor:pointer;font-size:12px;font-weight:bold}
.btn:hover{background:#1a6fb2}

/* Alerts */
.alert{padding:10px;border-radius:4px;margin:10px 0;font-size:12px;display:none}
.alert.ok{background:#e9ffec;border:1px solid #8fd19e;color:#1f7a38;font-size:14px;font-weight:bold}
.alert.err{background:#ffecec;border:1px solid #f5aca6;color:#8a1f11}

/* ====== Footer ====== */
.footer{background:#000032} 
.footer .banner img{display:block;width:100%;height:auto}
.footer .copy{color:#fff;text-align:center;padding:8px 0;font-size:10px}

/* ====== Responsive ====== */
@media (max-width:1020px){ .container{max-width:96%} }
@media (max-width:800px){
  .tabs-row{display:block}
  .main{display:block}
  .left,.mid,.right{flex:none;width:auto}
  .mid{display:none} /* hide middle graphics on small screens */
}
