/* CSS Document for Pacific Petroleum */

.heading {	font-family:Arial, Helvetica, sans-serif;
			font-size:18px;
			font-weight:bold;
			color:#006600;
			}
			
.subheading {font-family:Arial, Helvetica, sans-serif;
			font-size:16px;
			font-weight:bold;
			padding:15px;
			color:#FFFFFF;
			}
			
.text {		font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			font-weight:100;
			padding:15px;
			color:#FFFFFF;
			}

.lefttext {	font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			font-weight:100;
			padding-left:80px;
			color:#FFFFFF;
			}

.producttext {font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			font-weight:100;
			padding-left:100px;
			padding-right:40px;
			color:#FFFFFF;
			}
			
.productheading {font-family:Arial, Helvetica, sans-serif;
			font-size:18px;
			font-weight:bold;
			text-align:center;
			color:#006600;
			}

.productsubheading {font-family:Arial, Helvetica, sans-serif;
			font-size:16px;
			font-weight:bold;
			text-align:center;
			color:#FFFFFF;
			}

.producttitletext {font-family:Arial, Helvetica, sans-serif;
			font-size:14px;
			font-weight:bold;
			padding-left:100px;
			padding-right:40px;
			color:#FFFFFF;
			}

.titletext {font-family:Arial, Helvetica, sans-serif;
			font-size:14px;
			font-weight:bold;
			padding-right:40px;
			color:#FFFFFF;
			}
			
.ul {font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			color:#FFFFFF;
			margin-left:90px;
			}

						
.bottom_nav {font-family:Arial, Helvetica, sans-serif;
			font-size:11px;
			text-align:right;
			color:#FFFFFF;
			}
			
.centered_text {font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			font-weight:100;
			color:#FFFFFF;
			text-align:center;
			}

/* =========================
   NAVIGATION (FIXED)
   ========================= */

/* Wrapper: one line, no gaps from baseline/whitespace */
#topnav {
  font-size: 0;          /* remove inline gaps between inline-block anchors */
  line-height: 0;        /* remove baseline gap below images */
  white-space: nowrap;   /* keep all buttons on one line */
}

/* Links: stay inline, align to top */
#topnav a {
  display: inline-block;
  vertical-align: top;
}

/* Buttons (images): no border/margins; block to kill image baseline */
#topnav img {
  display: block;
  margin: 0;
  border: 0;
}

/* Optional: ensure the table cell holding the nav has no padding */
#topnav, #topnav * {
  padding: 0;
}

/* Optional: if nav wraps on small screens, allow horizontal scroll instead of stacking */
#topnav {
  overflow-x: auto;
  overflow-y: hidden;
}
/* NAVIGATION — horizontal row, no seam */
#topnav { font-size:0; line-height:0; white-space:nowrap; }
#topnav a { display:inline-block; vertical-align:top; }
#topnav img { display:block; margin:0; border:0; }

/* Remove any padding in the table cell that holds the nav */
.nav-cell { padding:0; line-height:0; }

/* Collapse the remaining 1–2px seam caused by image edges */
#topnav { margin-bottom:-2px; }   /* adjust to -1px or -3px if needed */
.after-nav { padding:0; line-height:0; }
.after-nav img { display:block; margin:0; }
/* ===== New primary navigation ===== */
:root { --nav-h:55px; --nav-bg:#9a9a9a; --nav-bg-hover:#b8b8b8; --nav-green:#0b7e0b; --sep-light:#d5d5d5; --sep-dark:#4e4e4e; --nav-seam:2px; }

.nav-cell { padding:0; }

/* wrapper + light strip under tabs (like original) */
.main-nav { background:var(--nav-bg); border-bottom:var(--nav-seam) solid #e6e6e6; margin-bottom:calc(var(--nav-seam) * -1); }

/* horizontal row */
.main-nav .menu {
  list-style:none; margin:0; padding:0;
  display:flex; align-items:stretch; gap:0;
  white-space:nowrap;
}

/* top-level items */
.main-nav .menu > li { position:relative; }

/* paired vertical separator between items */
.main-nav .menu > li + li { border-left:2px solid var(--sep-light); box-shadow:-1px 0 0 var(--sep-dark) inset; }

/* tab link */
.main-nav a {
  display:block; height:var(--nav-h); line-height:var(--nav-h);
  padding:0 18px; text-decoration:none; color:var(--nav-green);
  font:14px/var(--nav-h) Arial, Helvetica, sans-serif;
}
.main-nav a:hover,
.main-nav .is-active { background:var(--nav-bg-hover); }

/* dropdown */
.main-nav .has-sub .sub {
  position:absolute; left:0; top:100%;
  display:none; list-style:none; margin:0; padding:6px 0;
  background:var(--nav-bg); border:1px solid #6f6f6f; min-width:170px; z-index:1000;
}
.main-nav .has-sub:hover .sub { display:block; }
.main-nav .sub a {
  height:auto; line-height:1.3; padding:8px 14px; white-space:nowrap;
}