@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Poppins:wght@400;600;700&display=swap');
/* ==========================================================================
   Base / Reset
   ========================================================================== */

:root {
 --text:#2B2A3D;
 --muted:#5A5872;
 --black:#000;
 --white:#fff;
 --yellow:#ffd800;
 --brandBlue:#01387b;
 --brandBlue2:#328af7;
 --panel:#f7f7f7;
 --shadow: 0 2px 8px rgba(0,0,0,.12);
}
html {
	scroll-behavior: smooth;
}
*, *::before, *::after {
	box-sizing: border-box;
}
body {
	margin: 0;
	font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	font-weight: 400;
	color: var(--muted);
}
img, svg, video, iframe {
	max-width: 100%;
	vertical-align: middle;
}
a {
	color: inherit;
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}

:focus-visible {
outline: 2px solid rgba(0,0,0,.35);
outline-offset: 2px;
}
ul, ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	color: var(--text);
}
p {
	margin: 0;
	font-size: 18px;
	line-height: 30px;
	color: #333;
	text-align: left;
}

/* Reduce animation if user prefers */
@media (prefers-reduced-motion: reduce) {
html {
	scroll-behavior: auto;
}
* {
	animation-duration: 0.01ms !important;
	animation-iteration-count: 1 !important;
	transition-duration: 0.01ms !important;
}
}
/* ==========================================================================
   Utility
   ========================================================================== */

.bg_cover {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 100%;
	height: 100%;
}
.blackText {
	color: var(--black);
}
.whiteText {
	color: var(--white) !important;
	text-shadow: 1px 1px 2px #000;
}
.white {
	color: var(--white);
}
.bridgeYellow {
	color: var(--yellow) !important;
}
.bridgeBlack {
	color: var(--black) !important;
}
.centerIt {
	text-align: center;
}
.leftAlign {
	text-align: left;
}
.noUnderline {
	text-decoration: none !important;
}
.size36 {
	font-size: 36px !important;
}
.size30 {
	font-size: 30px !important;
}
.size24 {
	font-size: 24px !important;
}
.size18 {
	font-size: 18px !important;
}
.size14 {
	font-size: 14px !important;
}
.vertMargin30 {
	margin: 30px 0;
}
.tenMargin {
	margin: 10px;
}
.picBorder {
	border: 1px solid #333;
}
.secureTitle {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	gap: 8px;
}
.secureIcon {
	vertical-align: bottom;
}
.secureList {
	padding-left: 18px;
	text-align: left;
	margin: 10px 0;
	list-style: disc;
}
.secureNote {
	display: block;
	margin-top: 8px;
}
#allSites a {
	color: #0383fc;
	text-decoration: none !important;
}
#special {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	text-align: center; /* harmless fallback */
}
.float-left-img {
	float: left;
	margin: 0 10px 6px 0; /* space between image and text */
}

/* optional: don’t float on small screens */
@media (max-width: 576px) {
.float-left-img {
	float: none;
	display: inline-block;
	margin: 0 .25em;
	vertical-align: middle;
}
}
/* ==========================================================================
   Header / Navbar
   ========================================================================== */

.header_navbar {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
	transition: all .25s ease;
}
.navbar {
	padding: 20px 0;
	border-radius: 5px;
	transition: all .25s ease;
}
.sticky {
	position: fixed;
	background-color: #fff;
	box-shadow: 0 20px 50px rgba(0,0,0,0.05);
	z-index: 999;
}
.sticky .navbar {
	padding: 15px 0;
}
.navbar-brand {
	padding: 0;
}
.brand-pill {
	display: inline-block;
	background: #000;
	color: var(--yellow);
	padding: 0 8px 4px;
	line-height: 1.2;
}
.navbar-toggler {
	padding: 0;
	border: 0;
}
.navbar-toggler:focus {
	box-shadow: none;
}
.navbar-toggler .toggler-icon {
	width: 30px;
	height: 2px;
	background-color: #fff;
	display: block;
	margin: 5px 0;
	transition: all .25s ease;
}
.sticky .navbar-toggler .toggler-icon {
	background-color: #222;
}
.navbar-nav .nav-item {
	position: relative;
	margin-left: 40px;
}
.navbar-nav .nav-item a {
	font-size: 16px;
	font-weight: 400;
	color: #fff;
	padding: 10px 0;
	position: relative;
	transition: all .25s ease;
}
.navbar-nav .nav-item a::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 3px;
	background-color: #fff;
	transition: all .25s ease;
}
.navbar-nav .nav-item a.active::before, .navbar-nav .nav-item a:hover::before {
	width: 100%;
}
.sticky .navbar-nav .nav-item a {
	color: #222;
}
.sticky .navbar-nav .nav-item a::before {
	background-color: #000;
}
.sticky .navbar-nav .nav-item a.active, .sticky .navbar-nav .nav-item a:hover {
	color: #000;
}

/* Mobile nav dropdown behavior (Bootstrap collapse container) */
@media (max-width: 991px) {
.navbar-nav .nav-item {
	margin-left: 0;
}
.navbar-collapse {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	background: #fff;
	z-index: 9;
	box-shadow: 0 15px 20px rgba(0,0,0,0.1);
	padding: 8px 12px;
}
.navbar-nav .nav-item a {
	display: block;
	padding: 6px 0;
	color: #222;
}
.navbar-nav .nav-item a::before {
	display: none;
}
.navbar-nav .nav-item a.active, .navbar-nav .nav-item a:hover {
	color: #000;
}
}
/* ==========================================================================
   Hero
   ========================================================================== */

.single_hero {
	height: 750px;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.single_hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: rgba(43,42,61,0.5);
	z-index: -1;
}
 @media (min-width:1400px) {
.single_hero {
	height: 950px;
}
}
@media (max-width:991px) {
.single_hero {
	height: 700px;
}
}
@media (max-width:767px) {
.single_hero {
	height: 650px;
}
}
.hero_content {
	background: url(../images/yellowBack.png);
	border-top: 8px solid #fff;
	border-bottom: 8px solid #fff;
	color: #000;
	margin: -100px 40px 0;
	padding: 0;
}
.hero_content .hero_title {
	font-family: "Bebas Neue", sans-serif !important;
	font-size: 60px;
	line-height: 85px;
	color: #fff;
	margin-top: 15px;
}
.hero_content .hero_title span {
	display: contents;
	color: #000;
}
.hero-inline-img {
	height: 1em;
	width: auto;
	margin: 0 .2em;
	transform: translateY(.08em);
}
.heroSizer {
	margin-top: -20px !important;
	color: #000;
	line-height: 30px;
	font-size: 24px;
}
.hero-cta {
	text-align: center;
}
.truckButton {
	display: inline-block;
	margin-top: 20px;
	padding: 10px 20px 8px;
	border-radius: 8px;
	background: #0f0;
	border: none;
	color: #000;
	font-weight: 700;
	font-family: Arial, Helvetica, sans-serif;
	box-shadow: 2px 2px 0 #000;
}
.truckButton:hover {
	filter: brightness(.98);
}
 @media (max-width: 1199px) {
.hero_content .hero_title {
	font-size: 44px;
	line-height: 65px;
}
}
 @media (max-width: 991px) {
.hero_content .hero_title {
	font-size: 40px;
	line-height: 60px;
}
}
 @media (max-width: 767px) {
.hero_content {
	margin: -80px 12px 0;
}
.hero_content .hero_title {
	font-size: 26px;
	line-height: 38px;
}
}
 @media (max-width: 576px) {
.hero_content .hero_title {
	font-size: 32px !important;
	padding-bottom: 16px;
	margin-top: -4px !important;
}
.heroSizer {
	margin-top: -40px !important;
}
}
/* ==========================================================================
   Section Titles / Spacing
   ========================================================================== */

.section_title .title {
	font-size: 40px;
	font-weight: 700;
}
.section_title p {
	margin-top: 15px;
	font-size: 18px;
	color: #333;
}
 @media (max-width:767px) {
.section_title .title {
	font-size: 26px;
}
#special {
	text-align: center;
}
}
/* ==========================================================================
   Event Card
   ========================================================================== */

.event-card {
	margin: 10px 20px 10px 0;
	padding: 20px;
	background: #1a1a1a;
	color: #fff !important;
	border: 8px double #fff;
	font-family: "Times New Roman", Times, serif;
	max-width: 400px;
	float: left;
}
.event-card h2 {
	text-align: center;
	color: #fff;
}
.event-card p {
	color: #fff !important;
	line-height: 20px;
}
.event-card img {
	width: 100%;
}
 @media (max-width: 767px) {
.event-card {
	float: none;
	max-width: 100%;
	margin: 16px 0;
}
}
/* ==========================================================================
   Compare Panel (if present on other pages/includes)
   ========================================================================== */

#compare {
	margin-top: 160px;
	padding: 60px 30px;
	background: var(--brandBlue);
	color: #fff !important;
	border-top: 8px solid var(--brandBlue2);
	border-bottom: 8px solid var(--brandBlue2);
}
#compare h2 {
	color: #f9e95d !important;
	text-align: center;
	padding-bottom: 40px;
}
#compare p {
	color: #fff !important;
	font-size: 16px !important;
	line-height: 22px;
}
/* ==========================================================================
   Tables / Includes (truckTypes + secure block)
   ========================================================================== */

table.truckTypes {
	width: 100%;
	background: var(--panel);
	border-top: #95949e solid 9px;
	border-bottom: #95949e solid 9px;
	margin: 40px 0;
}
.truckTypes tr td {
	width: 33.333%;
	padding: 20px;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: 700;
}
.truckTypes tr td h4 {
	font-size: 12px;
	font-weight: 700;
	color: #900;
}
 @media (max-width: 767px) {
.truckTypes tr td {
	display: block;
	width: 100%;
}
}
.secureLot {
	display: block;
	width: 36%;
	background: #f5e900;
	margin: 10px;
	padding: 30px 20px 20px 30px;
	float: right;
	border-radius: 12px;
	color: #000;
	border: 3px solid #000;
	font-size: 12px;
}
.secureLot h3 {
	text-align: center;
	font-size: 30px !important;
}
.secureLot p {
	font-size: 16px;
	line-height: normal;
}
 @media (max-width: 576px) {
.secureLot {
	display: none;
}
}
/* ==========================================================================
   Ad Stack
   ========================================================================== */

.stackAds {
	float: left;
	margin: 10px 20px 10px 0;
}
.stackAds ul li {
	margin: 5px 10px;
}
.stackAds ul li img {
	border: 1px solid #333;
	display: block;
}
 @media (max-width: 767px) {
.stackAds {
	float: none;
	margin: 16px 0;
}
.stackAds ul {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: center;
}
.stackAds ul li {
	margin: 0;
}
}
/* ==========================================================================
   Bottom Locations Section (allSites.php output)
   ========================================================================== */

#bottomSec {
	margin: auto;
	text-align: center;
}
#bottomSec ul {
	margin: auto;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fff;
}
#bottomSec ul li {
	list-style: none;
	display: inline-block;
	background: #000;
	padding-bottom: 10px;
	margin: 20px 10px 10px;
	vertical-align: top;
}
#bottomSec ul li ul {
	background: var(--panel);
}
#bottomSec ul li ul li {
	background: var(--panel);
	display: block;
	margin: 2px;
	font-size: 1.3em;
	color: #000;
}
#bottomSec ul li img {
	margin-bottom: 10px;
}
/* ==========================================================================
   Contact / Map
   ========================================================================== */

.contactUs {
	text-align: center;
	background: #000;
	color: #fff;
	padding: 10px 8px;
	font-size: 16px;
	line-height: 1.4;
}
.contactSep {
	padding: 0 8px;
	opacity: .8;
}
.contactMail {
	color: var(--yellow);
}
.map-responsive {
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
	height: 0;
}
.map-responsive iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}
/* ==========================================================================
   Footer
   ========================================================================== */

.footer_area {
	margin-top: 40px;
	background-color: #000;
	padding-top: 15px;
	padding-bottom: 30px;
}
/* ==========================================================================
   Back to top
   ========================================================================== */

.back-to-top {
	font-size: 20px;
	color: #fff;
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 40px;
	height: 40px;
	line-height: 40px;
	border-radius: 5px;
	background-color: #000;
	text-align: center;
	z-index: 99;
	transition: all .2s ease;
	box-shadow: 0 2px 5px rgba(0,0,0,0.2);
	display: none;
}
.back-to-top:hover {
	color: #fff;
	background-color: #000;
}
/* ==========================================================================
   Preloader
   ========================================================================== */

.preloader {
	position: fixed;
	inset: 0;
	display: table;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 99999;
}
.preloader .loader {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}
.preloader .ytp-spinner {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 64px;
	margin-left: -32px;
	pointer-events: none;
}
.preloader .ytp-spinner-container {
	position: absolute;
	width: 100%;
	padding-bottom: 100%;
	top: 50%;
	left: 50%;
	margin-top: -50%;
	margin-left: -50%;
	animation: ytp-spinner-linspin 1568ms linear infinite;
}
.preloader .ytp-spinner-rotator {
	position: absolute;
	width: 100%;
	height: 100%;
	animation: ytp-spinner-easespin 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
.preloader .ytp-spinner-left, .preloader .ytp-spinner-right {
	position: absolute;
	top: 0;
	bottom: 0;
	overflow: hidden;
}
.preloader .ytp-spinner-left {
	left: 0;
	right: 50%;
}
.preloader .ytp-spinner-right {
	right: 0;
	left: 50%;
}
.preloader .ytp-spinner-circle {
	box-sizing: border-box;
	position: absolute;
	width: 200%;
	height: 100%;
	border-style: solid;
	border-color: #E84E4E #E84E4E #F9F9F9;
	border-radius: 50%;
	border-width: 6px;
}
.preloader .ytp-spinner-left .ytp-spinner-circle {
	left: 0;
	right: -100%;
	border-right-color: #F9F9F9;
	animation: ytp-spinner-left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
.preloader .ytp-spinner-right .ytp-spinner-circle {
	left: -100%;
	right: 0;
	border-left-color: #F9F9F9;
	animation: ytp-right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
 @keyframes ytp-spinner-linspin {
to {
transform:rotate(360deg);
}
}
 @keyframes ytp-spinner-easespin {
 12.5% {
transform:rotate(135deg);
}
 25% {
transform:rotate(270deg);
}
 37.5% {
transform:rotate(405deg);
}
 50% {
transform:rotate(540deg);
}
 62.5% {
transform:rotate(675deg);
}
 75% {
transform:rotate(810deg);
}
 87.5% {
transform:rotate(945deg);
}
 100% {
transform:rotate(1080deg);
}
}
 @keyframes ytp-spinner-left-spin {
 0% {
transform:rotate(130deg);
}
 50% {
transform:rotate(-5deg);
}
 100% {
transform:rotate(130deg);
}
}
 @keyframes ytp-right-spin {
 0% {
transform:rotate(-130deg);
}
 50% {
transform:rotate(5deg);
}
 100% {
transform:rotate(-130deg);
}
}