
body {
font-weight: 400; background-color: rgb(226 225 223 / 37%); color: #15264c; 
}
p {
  font-family: "Roboto", sans-serif;
  }
a {
  text-decoration: none;
}
a:hover { color: #73c5eb; text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Roboto", sans-serif;
  color: #302b2b;
}
textarea::placeholder {  
padding-right: 25px;
}  

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #37517e;
}

#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
  border: 6px solid #37517e;
  border-top-color: #fff;
  border-bottom-color: #fff;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: animate-preloader 1s linear infinite;
}

@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
transition: all 0.5s;
z-index: 2;
padding: 10px 0;
box-shadow: rgb(50 50 93 / 10%) 0px 2px 5px -1px, rgb(0 0 0 / 4%) 0px 1px 3px -1px;
}

#header.header-scrolled,
#header.header-inner-pages {
background: rgb(255 255 255 / 89%);
position: static;
}
.scrolled .header-scrolled .navbar a {
color: #000;
}

#header .logo img {
  max-height: 80px;
}
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
@media screen and (max-width: 1400px) {
.header-scrolled .navbar a, .navbar a:focus {
color: #fff!important; /* prevents mobile menu from changing colors */
  }
}
.mobile-display {
display: none !important;
}
.mobile-show img{
display: none !important;
}
@media screen and (max-width: 1400px) {
.mobile-show img{
display: block !important;
}
.mobile-hide {
display: none!important;
}
.mobile-display {
display: block !important;
  }
}
.invert {
filter: brightness(0) invert(1); margin: 0 0 20px 8px;  
}
.navbar {
padding: 0;
}
.navbar ul {
margin: 0;
padding: 0;
display: flex;
list-style: none;
align-items: center;
}
.navbar li {
position: relative;
}
.navbar a,
.navbar a:focus {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 0 10px 30px;
font-size: 15px;
font-weight: 500;
color: #302b2b;
white-space: nowrap;
transition: 0.3s;
}
.navbar a i,
.navbar a:focus i {
font-size: 12px;
line-height: 0;
margin-left: 5px;
}
.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover > a {
color: #d12d15;
}
.add-on { /* pickup btn (DESKTOP ONLY) added later date */
border-top-width: 0!important; 
border-right-width: 1.2rem!important; 
border-bottom-width: 0!important; 
border-left-width: 0!important;
border-color: rgb(255 255 255 / 40%)!important;
border-style: solid!important;
}
.navbar .getstarted,
.navbar .getstarted:focus {
padding: 15px 20px;
margin-left: 30px;
color: #fff;
background-color: #d12d15;
border: 2px solid #d12d15;
text-decoration: none;
overflow: hidden;
height: 93px;
margin-top: -25px;
margin-bottom: -25px;
margin-right: -48px;
border-radius:  0 0 0.375rem 0;
/*1st ver is original - second after client requested a change -- leave these off because shadow is inherited from navbar */
} 
.navbar a, .navbar a:focus {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 0 10px 30px;
font-size: 15px;
font-weight: 500;
color: #302b2b;
white-space: nowrap;
transition: 0.3s;
text-decoration: none;
font-family: 'Open Sans', sans-serif;
}
.navbar .getstarted:hover,
.navbar .getstarted:focus:hover {
color: #fff;
background: #ff391b;
border-color: #ff391b;
}

.mobile-nav-toggle {
color: #000;
font-size: 28px;
cursor: pointer;
display: none;
line-height: 0;
transition: 0.5s;
}
.mobile-nav-toggle.bi-x {
color: #fff;
} 

/* nav dropdown */
.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 14px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 20px 0;
  width: 200px;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
  border-radius: 10px;
}
/*
.navbar .dropdown ul li {
  min-width: 200px;
}
*/
.navbar .dropdown ul a {
  padding: 10px 20px;
  font-size: 14px;
  text-transform: none;
  font-weight: 500;
  color: #0c3c53;
}

.navbar .dropdown ul a i {
  font-size: 12px;
}

.navbar .dropdown ul a:hover,
.navbar .dropdown ul .active:hover,
.navbar .dropdown ul li:hover>a {
  color: #d12d15;
}

.navbar .dropdown:hover>ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}

.navbar .dropdown .dropdown:hover>ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}

@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }

  .navbar .dropdown .dropdown:hover>ul {
    left: -100%;
  }
}
/* mobile nav dropdown */
.navbar-mobile .dropdown ul {
position: static;
display: none;
margin: 10px 20px;
padding: 10px 0;
z-index: 99;
opacity: 1;
visibility: visible;
background: #fff;
box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}
.navbar-mobile .dropdown ul li {
 min-width: 200px;
}
.navbar-mobile .dropdown ul a {
padding: 10px 20px;
}
.navbar-mobile .dropdown ul a i {
font-size: 12px;
}
.navbar-mobile .dropdown ul a:hover,
.navbar-mobile .dropdown ul .active:hover,
.navbar-mobile .dropdown ul li:hover>a {
  color: #47b2e4;
}
.navbar-mobile .dropdown>.dropdown-active {
display: block;
}

@media (max-width: 1400px) {
.menu-div { /*experiment */
display: inline-block;
}
.hide { /*experiment */
  display: none!important; 
}
.mobile-nav-toggle {
display: block;
}
.navbar .getstarted, .navbar .getstarted:focus {
padding: 10px 20px;
color: #fff!important;
font-size: 1.8em;
background-color: transparent;
border: 0;
text-decoration: none;
margin-top: -15px!important;
box-shadow: unset;
}
.navbar-mobile .dropdown ul {
background: transparent;
box-shadow: unset;
}
.bi-chevron-down::before {
font-size: x-large;
}
.navbar .dropdown ul a {
font-size: 1.8rem;
}
.navbar ul {
display: none;
}
.navbar a, .navbar a:focus {
color: #fff;
font-size: 1.8em;
}
}
@media (max-width: 820px) {
.navbar a, .navbar a:focus, .navbar .getstarted, .navbar .getstarted:focus, .navbar .dropdown ul a {
font-size: 1.4em;
}
}
@media (max-width: 430px) {
.bi-chevron-down::before {
font-size: small;
}
}
@media (max-width: 375px) { 
.navbar a, .navbar a:focus, .navbar .getstarted, .navbar .getstarted:focus, .navbar .dropdown ul a {
font-size: 1.2em;
}  
}
@media (max-width: 280px) {
.navbar a, .navbar a:focus, .navbar .getstarted, .navbar .dropdown ul a {
font-size: 1em;
}
.navbar-mobile .dropdown ul li {
min-width: unset;
}
}
.navbar-mobile {
position: fixed;
overflow: hidden;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: #e74c3c;
transition: 0.3s;
z-index: 999;
margin: 0 0 0 65%;
border-radius: 0 25px 0 0;
}
@media (max-width: 820px) {
.navbar-mobile {
margin: 0 0 0 50%;  
}
}
@media (max-width: 540px) {
.navbar-mobile {
margin: 0 0 0 0;
}
}
.navbar-mobile .mobile-nav-toggle {
position: absolute;
top: 15px;
right: 15px;
}
.navbar-mobile ul {
display: block;
position: absolute;
top: 55px;
right: 15px;
bottom: 15px;
left: 15px;
padding: 10px 0;
border-radius: 5px;
background-color: #e74c3c;
overflow-y: auto;
transition: 0.3s;
padding: 25px;
}
.navbar-mobile a,
.navbar-mobile a:focus {
padding: 10px 20px;
color: #fff!important;
}
.navbar-mobile a:hover,
.navbar-mobile .active,
.navbar-mobile li:hover > a {
 color: rgb(255 255 255 / 83%);
}

.navbar-mobile .getstarted,
.navbar-mobile .getstarted:focus {
  margin: 15px;
  color: rgb(255 255 255 / 83%);
}
@media (max-width: 1400px) {
 .navbar-mobile .getstarted,
.navbar-mobile .getstarted:focus {
  margin: 0;
  } 
}  
/* Misc */
/*
.lt a {
  color: #2666f3;
  text-decoration: none;
}  
.lt a:hover {
  color: rgb(38 102 243 / 70%);
}
*/
.faq h1 {
font-size: 8vw;
color: #15264c;
font-weight: 800;
line-height: 1;
margin-top: 15rem;
}
.faq h2 {
font-size: 2.3rem;
color: #15264c;
font-weight: 700;
line-height: 1;
margin: 25px 0 25px 0;
}
.faq h3 {
font-size: 1.7rem;
line-height: 1.2;
font-weight: 600;
margin: 75px 0 50px 0;
color: #15264c;
}
.sub h2 {
font-size: 1.5rem;
color: #15264c;
font-weight: 400;
line-height: 1;
margin: 25px 0 25px 0;
font-family: 'Open Sans', sans-serif;
}
.sub h3 {
font-size: 2.5rem;
color: #15264c;
font-weight: 700;
line-height: 1;
margin: 12px 0 0 0;
}
.sub h4 {
font-size: 1.5rem;
color: #15264c;
font-weight: 700;
line-height: 1;
}
.pickup {
padding: 25px 0 0 0;
}

/* Index */
/*
.video-intro {
margin-left: 100px;  
}
*/
.video-intro h1 {
font-family: "Poppins", sans-serif;
font-size: 4.7vw;
font-weight: 700;
line-height: 1;
color: #fff;
letter-spacing: -0.1px;  
}
.video-intro h2 {
font-family: "Poppins", sans-serif;
font-size: 2.5vw;
line-height: 1.9;
color: #fff;
letter-spacing: -0.1px; 
margin: 0 0 27px 0; 
}
.first-section {
/*background-color: rgb(255 225 195 / 26%);*/
background-color: rgb(130 127 122 / 6%);
padding: 15rem 0 10rem 0;
} 
.second-section {
background-color: #302b2b;
padding: 5rem 0 10rem 0;
} 
.history-lead h1 {
font-size: 2.3rem;
color: #15264c;
font-weight: 400;
line-height: 1.7;
letter-spacing: -0.1rem;
text-shadow: 0 0 0.5em rgb(0 0 0 / 8%);
}
.history-lead h1 span {
font-size: 12rem;
color: #15264c;
font-weight: 800;
line-height: 1;
letter-spacing: -0.2rem;
}
.clients h4 {
font-size: 4rem;
color: #d6d6d6;
font-weight: 700;
line-height: 1;
letter-spacing: -0.1rem;
margin-bottom: 75px;
}
.clients span {
  font-size: 5.5rem;
  line-height: 1;
  letter-spacing: -0.2rem;
  color: #ffea33;
}

.bg-light {
    --bs-bg-opacity: 1;
    background-color: #292525!important;
}
.bg-light:hover {
  background-color: #0e69b3!important;
}

.cta-main {
display: inline-block;
padding: 18px 20px;
border-radius: 2rem 0 2rem 2rem;
color: #fff;
font-size: 1rem;
background-color: #d12d15;
border: 2px solid #d12d15;
font-weight: 600;
text-decoration: none;
}
.cta-main:hover {
text-decoration: none;
color: #fff;
}
.larger { /* Let's Talk */
  font-size: 1.3rem;
  padding: 14px 20px;
}
.cta-blanco {
display: inline-block;
padding: 18px 20px;
border-radius: 2rem 0 2rem 2rem;
color: #fff;
font-size: 1rem;
background-color: #1B264E;
border: 2px solid #1B264E;
font-weight: 600;
text-decoration: none;
}
.cta-blanco:hover {
text-decoration: none;
color: #fff;
}
.webp .companies__logos {
width: 100%;
height: 80px;
background: url(../../img/company-logos.webp);
background-repeat: repeat-x;
background-size: auto 100%;
will-change: contents;
-webkit-animation: 60s scrollCompanies infinite linear;
-o-animation: 60s scrollCompanies infinite linear;
animation: 60s scrollCompanies infinite linear;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.no-webp .companies__logos {
width: 100%;
height: 80px;
background: url(../../img/company-logos.png);
background-repeat: repeat-x;
background-size: auto 100%;
will-change: contents;
-webkit-animation: 60s scrollCompanies infinite linear;
-o-animation: 60s scrollCompanies infinite linear;
animation: 60s scrollCompanies infinite linear;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.no-webp .history {
background-image: url(../img/history-bg.jpg);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
height: 60vh;
}
.webp .history {
background-image: url(../img/history-bg.webp);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
height: 60vh;
}
.no-webp .about {
background-image: url(../img/company-bg.jpg);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
height: 60vh;
}
.webp .about {
background-image: url(../img/company-bg.webp);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
height: 60vh;
}
.no-webp .ffs { /*packaging */
background-image: url(../img/packaging-facility.jpg);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
height: 60vh;
}
.webp .ffs { 
background-image: url(../img/packaging-facility.webp);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
height: 60vh;
}
.no-webp .careers {
background-image: url(../img/twhs.jpg);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
background-position: right;
height: 60vh;
}

.webp .careers {
background-image: url(../img/twhs.webp);
background-color: rgb(234 231 175 / 20%);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
background-position: right;
height: 60vh;
}
/*
.bwh {
background-image: url(../img/baltimore-warehouse.jpg);
background-color: #000;
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
height: 100vh;
min-width: 40vw;
}
*/
.hero-content  h1 {
color: #15264c;
font-size: 4.5rem;
line-height: 1.3;
font-weight: 900;
}
.hero-content  h2 {
color: rgb(21 38 76 / 89%);
font-size: 2rem;
line-height: 1;
font-weight: 900;
padding-bottom: 30px;
}
.hero-content h1 span {
color: #15264c;
font-size: 4rem;
line-height: 1;
font-weight: 700;
letter-spacing: -0.2rem;  
}
.wh h3 {
color: #15264c;
font-size: 3.5rem;
line-height: 1;
font-weight: 700;
letter-spacing: -0.1rem;
padding-bottom: 20px;
}
.team {
font-weight: 600;
color: #15264c;
background-color: rgb(255 255 255 / 70%);
padding: 5px 40px 5px 40px;
border-radius: 5px;
text-decoration: none;
margin-bottom: 40px;
}
.team:hover {
background-color: rgb(216 228 243 / 65%);
text-decoration: none;
color: #15264c;
}
.dir p {
font-size: 1.4rem;
line-height: 1.2;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
text-shadow: rgb(0 0 0 / 1%) 0 0 1px;
text-align: center;
margin-top: 20px;
margin-top: -50px;
}

/* TEAM Page*/
.li-logo {
margin-right: 9px;
}
.job p {
font-size: 1.3rem;
line-height: 1;
color: rgb(255 255 255 / 88%);
margin-top: 2.4rem;
font-weight: 700;
}
.job h4 {
color: rgb(255 255 255 / 88%);
margin-top: -6px;
font-size: 1.1rem;
font-weight: 400;
line-height: 0.6;
padding: 0 0 10px 0;
}
.dir span {
font-weight: 600;
color: #15264c;
background-color: rgb(255 255 255 / 70%);
padding: 5px 30px 5px 30px;
border-radius: 5px 0 5px 5px;
text-decoration: none;
margin-bottom: 40px;
}
.icons a {
background-color: transparent;
padding: 0; 
}
.en-icon a:hover {
opacity: 0.7  
}
.assc a {
background-color: rgb(188 199 219 / 23%);
border-radius: 1rem 0 1rem 1rem;
padding: 15px 15px 15px 20px;
font-weight: 600;
color: #0d69b3;
text-decoration: none;
}
.assc a:hover {
  text-decoration: none;
  background-color: rgb(239 242 247 / 33%);
}
.assc p {
  margin-bottom: 45px;
}
/* TEAM End */
.bio h1, .bio h3 {
font-size: 6rem;
color: #15264c;
font-weight: 800;
line-height: 1;
}
.bio h2 {
font-size: 1.5rem;
color: #15264c;
font-weight: 400;
line-height: 1;
}
.bio p {
font-size: 1.5rem;
line-height: 1.6;
}
/* Timeline History Pg */
.card {
background: rgb(204 178 136 / 15%);
}
.card-text {
font-size: 1.2rem;
line-height: 1.4;
text-transform: none;  
}
.bsb-timeline-7 .timeline:after {
background-color: rgb(64 56 43 / 31%);
}
.bsb-timeline-7 .timeline>.timeline-item:after {
background: #ccb288;
border: var(--bsb-tl-circle-border-size) solid #ccb288;
}
.fw-bold {
font-weight: 600;
font-size: 1.5rem;
line-height: 3.5;
color: #40382b;
}    
.bg-success-subtle {
background-color: #ccb288!important;
border-color: #ccb288!important;
}
@media (min-width: 768px) {
.bsb-timeline-7 .timeline>.timeline-item .timeline-meta {
display: flex;
justify-content: flex-end;
left: -100%;
margin: 0;
padding: 0 2.5rem 0 0;
position: absolute;
top: calc(45% - 29px);
width: 100%;
z-index: 1;
}
}  
.bsb-timeline-7 .timeline>.timeline-item .timeline-indicator:after {
border: unset;  
}
.rounded-2 {
/* border-radius: var(--bs-border-radius)!important; */
border-radius: 100%!important;
height: 100px;
 width: 100px;
} 
/* Index Pg */
.intro-home {
padding-bottom: 75px;  
}
.intro-home p {
font-size: 2.3rem;
line-height: 1.5;
color: #15264c;
margin: auto;
font-weight: 400;
}
.intro-home h3 {
font-size: 7rem;
color: #302B2B;
font-weight: 800;
line-height: 0.5;
text-shadow: 0 0 1em rgb(0 0 0 / 19%);
}
.intro-home h3 span {
font-size: 4rem;
color: #0e69b3;
font-weight: 500;
line-height: 1;
}
.webp .retro {
 background-image: url(../img/bg-founded.webp);
background-repeat: no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
-o-background-size: contain;
min-height: 800px;
padding-top: 180px;
margin-bottom: 100px;
}
.no-webp .retro {
 background-image: url(../img/bg-founded.png);
background-repeat: no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
-o-background-size: contain;
min-height: 800px;
padding-top: 180px;
margin-bottom: 100px;
}
.since h5 {
font-size: 5rem;
line-height: 1;
letter-spacing: -0.3rem;
font-weight: 800;
color: #302B2B;
}
.since span {
color: #286AB5;
font-size: 10rem;
letter-spacing: -0.6rem;
}
.since p {
font-size: 1.3rem;
line-height: 1.6;
color: rgb(52 40 35 / 92%);
}
/* Global */
.foto {
border-radius: 10px 0 10px 10px;
}
.foto-reverse {
border-radius: 0 10px 10px 10px;
}
.foto-tl {
border-radius: 10px 0 0 0;  
}
.h-line { /* red horizontal line */
width: 100px; 
height: 5px; 
display: inline-block;
background-color: #d12d15; 
margin-bottom: 35px;
}
.h-line-blanco { /* white horizontal line */
width: 100px; 
height: 5px; 
display: inline-block;
background-color: #fff; 
margin-bottom: 35px;
}


/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {
  width: 100%;
  background-image: url("../img/temp-img.jpg");
  background-position: 0 0;
  background-repeat: no-repeat;
  height: 100vh;
}



#hero h1 {
  margin: 0 0 10px 0;
  font-size: 7rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.2rem;
  color: #fff;
}

#hero h2 {
  color: rgba(255 255 255 / 83%);
  margin-bottom: 50px;
  font-size: 2.3rem;
}

#hero .btn-get-started {
  font-family: "Jost", sans-serif;
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 10px 28px 11px 28px;
  border-radius: 50px;
  transition: 0.5s;
  margin: 10px 0 0 0;
  color: #fff;
  background: #47b2e4;
}

#hero .btn-get-started:hover {
  background: #209dd8;
}

#hero .animated {
  animation: up-down 2s ease-in-out infinite alternate-reverse both;
}


@media (max-width: 991px) {
  #hero {
    height: 100vh;
    text-align: center;
  }

  #hero .animated {
    animation: none;
  }

  #hero .hero-img {
    text-align: center;
  }

  #hero .hero-img img {
    width: 50%;
  }
}

@media (max-width: 768px) {
  #hero h1 {
    font-size: 28px;
    line-height: 36px;
  }

  #hero h2 {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 30px;
  }

  #hero .hero-img img {
    width: 70%;
  }
}

@media (max-width: 575px) {
  #hero .hero-img img {
    width: 80%;
  }

  #hero .btn-get-started {
    font-size: 16px;
    padding: 10px 24px 11px 24px;
  }
}

@keyframes up-down {
  0% {
    transform: translateY(10px);
  }

  100% {
    transform: translateY(-10px);
  }
}

section {
  padding: 60px 0;
  overflow: hidden;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer {
padding: 0;
}

#footer .footer-top, .footer-contact {
margin-bottom: 30px;
position: relative;
}
.footer-contact p {
font-size: 1rem;
color: #d7dae0;  
}

.footer-contact a span { /* telephone */
color: #d7dae0;
text-decoration: none;
}
.footer-contact a:hover span {
  color: #d7dae0;
  text-decoration: none;
}
.video-link {
display: inline-block;
margin-top: 1rem;
text-decoration: none;
background: transparent linear-gradient(90deg,#fff 50%,rgba(156,158,165,.6) 0) no-repeat;
background-size: 202% 1px;
background-position: 100% 100%;
border: none;
font-size: inherit;
padding: 0 0 2px;
transition: all .3s;
color: #d7dae0;
}
a.video-link:hover {
    color: #fff;
}
body a:hover { /* hover effect for video-link */
background-position: 0 100%;
}
a {
text-decoration: none!important;
}
.bottom-row {
font-size: 14px;
background: #15264c;
padding: 25px 0 50px 0;
margin: 0 50px 50px 50px;
border-radius: 0 0 1rem 1rem;
}
.youtube {
vertical-align: -.12em;
}
#footer .footer-top {
  padding: 120px 0 25px 0;
  margin: 0 50px 0 50px;
  border-radius: 1rem 0 0 0;
  background: #15264c;
}
#footer .footer-top h4 {
  font-size: 16px;
  font-weight: bold;
  color: #37517e;
  position: relative;
  padding-bottom: 12px;
}
.social-links a {
font-size: 2rem;
color: #fff;
line-height: 1;
padding: 0 15px 0 0;
width: 36px;
transition: 0.3s;
}
#footer .footer-top .social-links a:hover {
color: #d12d15;
}
#footer .footer-bottom {
  padding-top: 30px;
  padding-bottom: 30px;
  color: #fff;
}
.colophon {
margin: 50px 0 0 0;
}
.colophon p { width: 100%; font-size: 0.9rem; color: #fff; line-height: 1.1;
}
.colophon a { color: #fff; text-decoration: underline; text-decoration-color: rgb(255 255 255 / 59%);
}
.colophon a:hover { color: #fff; text-decoration: none;
}

@media (max-width: 768px) {
  #footer .footer-bottom {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  #footer .copyright,
  #footer .credits {
    text-align: center;
    float: none;
  }

  #footer .credits {
    padding-top: 4px;
  }
}

/* Cards on Index Page */
.card-holder {
position: relative; 
overflow: hidden;
z-index: 2;
}
/*
.ch-right {
margin-right: 25px;
}
*/
.card {
position: absolute;
right: 13px;
left: 13px;
bottom: -2%;
border: none;
padding: 3em 1.47059em 1.47059em 0.3em;
background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), rgb(0 0 0 / 58%));
text-transform: uppercase;
}
.logistics { margin-bottom: 75px; }
@media (max-width: 540px) {
.card {
font-size: 28px;
}  
.sub-head {
bottom: 35px;
left: 30px;
font-size: 12px;
}     
.ch-right {
margin-right:25px;
}            
}
.sub-head {
position: absolute;
bottom: 10px;
left: 30px;
color: #ffea01;
font-size: 24px;
z-index: 1;
/*padding-left: 65px;*/
text-shadow: 0 0 0.5em rgb(0 0 0 / 53%);
}
.services a {
color: #fff;
text-shadow: 0 0 0.5em rgb(0 0 0 / 53%);
position: relative;
}
.services a:hover {
color: #fd553c;
}
.services h4 {
font-size: 3rem;
color: #fff;
text-transform: uppercase;
font-weight: 800;
line-height: 0.4;
}
.services h4 a {
text-decoration: none;
}
@media (min-width: 280px) and (max-width: 320px){
.ch-right {
margin-right:unset;
}         
}
/* End Card */

/*
.fleet h3 {
font-size: 8rem;
line-height: 0.7;
font-weight: 800;
letter-spacing: -0.4rem;
text-shadow: 0 0 0.5em rgb(0 0 0 / 4%);
}
.fleet h3 span {
font-size: 3.5rem;
line-height: 0.7;
font-weight: 800;
letter-spacing: -0.2rem;
margin: 45px 0 0 0;
}
.sign {
  position: absolute;
  width: 350px;
  top: 2%;
  left: 8%;
  transform: rotate(342deg);
}
.btn-story {
  display: inline-block;
  padding: 12px 80px;
  text-decoration: none;
  margin-top: 35px;
  border-radius: 50px;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  border: 2px solid #d12d15;
  background: #d12d15;
  font-family: 'Open Sans', "sans-serif;";

}
.btn-story:hover {
  color: #fff;
  text-decoration: none;
}
*/
.button:hover {
  animation: buttonHover 0.5s ease forwards !important;
}
button {
  touch-action: manipulation !important;
}
button {
  cursor: pointer !important;
}
@keyframes buttonHover {
  0% {
    transform: scaleX(1) scaleY(1);
  }
  40% {
    transform: scaleX(1.1) scaleY(0.9);
  }
  80% {
    transform: scaleX(0.95) scaleY(1.05);
  }
  100% {
    transform: scaleX(1) scaleY(1) !important;
  }
}
.quote-btn {
  padding: 8px 20px;
  border-radius: 50px;
  color: #ff391b;
  font-size: 1.4rem;
  background-color: transparent;
  border: 2px solid #fff;
  font-weight: 400;
}

/* Connect & Quote
.form-intro h2 { font-size: 3.5rem; font-weight: 700; line-height: 1; letter-spacing: -0.2rem;
}

.form h4 {
font-size: 1.7rem;
line-height: 3;
letter-spacing: -0.1rem;
margin: 75px 0 30px 0;
text-align: left;
}
.form-noborder h3 {
font-size: 1.7rem;
line-height: 3;
letter-spacing: -0.1rem;
margin: 35px 0 10px 0;
text-align: left;
}
.form-intro h2 span {
font-size: 6.5rem;
font-weight: 800;
line-height: 0.8;
letter-spacing: -0.2rem;
}
.quote h1 {
font-size: 4.5rem;
font-weight: 800;
line-height: 1;
letter-spacing: -0.2rem;
margin-bottom: 0;
padding: 18rem 0 0 0;
text-shadow: 0 0 0.5em rgb(0 0 0 / 9%);
}
.quote h1 span {
font-size: 26rem;
color: #302b2b;
font-weight: 800;
line-height: 1;
letter-spacing: -1rem;
}
.connection h1 {
font-size: 4.5rem;
color: #2e2a23;
font-weight: 800;
line-height: 1;
letter-spacing: -0.2rem;
padding: 20rem 0 0 0;
}
.connection h1 span {
font-size: 14rem;
color: #2e2a23;
font-weight: 800;
line-height: 1;
letter-spacing: -0.7rem;
}
*/
.form-arrow {
width: 50px;
height: auto;
transform-style: preserve-3d;
position: absolute;
top: 75%;
left: 70%;
transform: rotateX(0)rotateY(24deg)rotate(318deg);}
.form {
margin-bottom: 10rem;
}
.sec-col {
padding-left: 10px;
}
.request-form {
padding: 0 0 10rem 0;
}  
.form-row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: -24px;
}
.form-control-input-form-main {
display: block;
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
margin-bottom: 2.5rem;
padding-left: 1.625rem;
border-bottom: 2rem;
border: 1px solid #ececec;
border-radius: 10px 0 10px 10px;
background-color: #ffffff;
color: #515867;
font-size: 1.2rem;
/*line-height: 3.875rem;*/
transition: all 0.2s;
    /*-webkit-appearance: none; Hides caret */
}

select {
background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc);
background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), calc(100% - 2.5em) 0.8em;
background-size: 5px 5px, 5px 5px, 1px 1.5em;
background-repeat: no-repeat;
  /* reset */
margin: 0;      
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-appearance: none;
-moz-appearance: none;  
}

select:focus {
background-image:linear-gradient(45deg, white 50%, transparent 50%),linear-gradient(135deg, transparent 50%, white 50%),linear-gradient(to right, #ccc, #ccc);
background-position:calc(100% - 15px) 1em, calc(100% - 20px) 1em, calc(100% - 2.5em) 0.5em;
background-size: 5px 5px, 5px 5px, 1px 1.5em;
background-repeat: no-repeat;
border-color: green;
outline: 0;
}
form textarea {
display: block;
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
margin-bottom: 1rem;
padding-left: 1.625rem;
border-bottom: 2rem;
border: 1px solid #ececec;
border-radius: 10px 0 10px 10px;
background-color: #ffffff;
color: #515867;
font-size: 1.2rem;
line-height: 1.575rem;
transition: all 0.2s;
-webkit-appearance: none;
}
.multi-select-container {
  width: 100%
}

.multi-select-button {
  max-width: 100%;
  width: 100%;  
  position: relative;
}

.multi-select-button:after {
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -2.8px;
}

.multi-select-modal + .multi-select-menu { position: fixed;
  width: 500px;
  min-width: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.form-control-input:focus {
border: 1px solid #a1a1a1;
outline: none;
}
.form-control-input:hover {
border: 1px solid #a1a1a1;
}
.notes li {
font-size: 1.2rem;
line-height: 1.5;
margin-bottom: 10px;
color: #15264c;
}
.notes li:first-child {
  margin-top: 1rem;
}
.btn-group button {
    border-radius: 4px;
    background: #fff;
    -webkit-box-shadow: 0px 10px 23px -16px rgb(0 0 0 / 14%);
    -moz-box-shadow: 0px 10px 23px -16px rgba(0, 0, 0, 0.14);
    box-shadow: 0px 10px 23px -16px rgb(0 0 0 / 14%);
    padding: 0 10px;
    text-align: left;
    }
.btn-group > .btn, .btn-group-vertical > .btn {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

/* Quote Page */
label {
color: #131212;
font-size: 1.2rem;
padding: 0 0 25px 15px;
} 
.value ul {
font-size: 1.3rem;
color: #15264c;
list-style: disc;
}
.bi-check-square::before {
margin-right: 6px;
}

.form-check {
margin-bottom: 1.5rem;
}  

.last {
margin-bottom: 3rem;    
}
 /* Custom Modal Stuff Below */

.md-show ~ .md-overlay {
opacity: 1;
visibility: visible;
}
.md-overlay {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
top: 0;
left: 0;
z-index: 1000;
opacity: 0;
background: rgba(143,27,15,0.8);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-12 ~ .md-overlay {
background: #e74c3c;
}
.md-modal {
position: fixed;
top: 50%;
left: 50%;
width: 100%;
max-width: 630px;
min-width: 320px;
height: auto;
z-index: 2000;
visibility: hidden;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.message-me h2 {
font-size: 3rem;
line-height: 1;
font-weight: 700;
color: #fff;  
}
.message-me p {
color: #fff;
font-size: 1.5rem;
line-height: 1.7  
}

@media (max-width: 430px) {
.message-me p {
font-size: 1.2rem;
}
.message-me h2 {
font-size: 2rem;  
}
}
.show {
visibility: visible;
}
.modal-backdrop {
--bs-backdrop-bg: rgb(209 45 21 / 90%)!important;
--bs-backdrop-opacity: 0.99!important;
} 
.btn-close-form {
display: inline-block;
padding: 12px 80px;
text-decoration: none;
margin: 50px 0 0 0;
border-radius: 50px;
color: #fff;
font-size: 18px;
border: 2px solid #fff;
background: #d12d15;
}
.btn-close-form:hover {
color: #d12d15;
background-color: #fff;
}

/* video hover effect */
.c-i img,
.c-i video,
.c-i::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: 0.7s;
  object-fit: cover;
}

.c-i::before {
  content: "";
  z-index: 2;
}
.c-i {
  height: 768px;
  position: relative;
  border-radius: 10px 0 10px 10px;
  margin-bottom: 20px;
  overflow: hidden;
  cursor: pointer;
}
.c-i img {
  z-index: 1;
}
.h-ove-r img {
  opacity: 0;
}
.video-container {
  padding-left: 45px;
}
.err { margin-bottom: 10rem; }
.err h1 {
padding: 18rem 0 0 0;
font-size: 5rem;
font-weight: 800;
line-height: 0.9;
letter-spacing: -0.2rem;
text-shadow: 0 0 1em rgb(0 0 0 / 10%);
}
@media (max-width: 576px) {
.err h1 {
padding-top: 12rem;  
}  
}
/* FAQs  Accordian */
.accordion-button:not(.collapsed) {
background-color: transparent;
}
.accordion-button:focus {
box-shadow: none;
}        
.accordion-flush .accordion-item {
padding: 5px;
margin-bottom: 10px;
border-radius: 10px 0 10px 10px;
}
.accordion-button {
font-size: 1.3rem;
line-height: 1.4;
}
.accordion-body {
  font-size: 1.2rem;
}
.accordion {
  margin: 0 0 10rem 0;
}

.assoc h4 {
font-size: 2.5rem; letter-spacing: -0.1rem; line-height: 0.7; font-weight: 800; text-shadow: 0 0 0.5em rgb(0 0 0 / 3%);
}
.assoc h4 span {
font-size: 5rem; letter-spacing: -0.3rem; line-height: 1; font-weight: 800;
}
.you h2 {
font-size: 5.5rem; letter-spacing: -0.3rem; line-height: 0.6rem; font-weight: 800; text-shadow: 0 0 0.5em rgb(0 0 0 / 4%); 
}
.you h2 span {
font-size: 9rem; letter-spacing: -0.5rem; line-height: 1.4; font-weight: 800;
}
.elsuper {
  font-size: 8rem;
  margin: 0 0 5rem 0;
  color: #ff391b;
}
.team h1 {
  font-size: 5rem;
  line-height: 1;
  font-weight: 800;
  line-height: 0.8;
  letter-spacing: -0.3rem;
  padding: 18rem 0 0 0;
}
.team h1 span {
  font-size: 15rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.9rem;
  text-shadow: 0 0 1em rgb(0 0 0 / 7%);
}
.team h2 {
  font-size: 3rem;
  font-weight: 800;
  line-height: 0.8;
  letter-spacing: -0.1rem;
  padding: 50px 0 25px 0;
}
.small p {
  font-size: 1rem;
  line-height: 1.3;
  margin: 75px 0 50px 0;
}
.mt-9 {
  margin-top: 9rem;
}
.msg h2 {
font-size: 3rem;
line-height: 1;
font-weight: 700;
color: #fff;  
}
.msg p {
color: #fff;
font-size: 1.5rem;
line-height: 1.7;  
}

.intro-block p {
font-size: 1.45rem;
line-height: 1.6;
color: rgb(255 255 255 / 85%);
display: block;
background-color: #0d69b3;
padding: 25px;
border-radius: 25px 0;
margin-bottom: 50px;
margin-right: 75px
}

.dir-img {
margin-left: -15px;  
}

/* Pop Animation */
.popup {
transition: 0.45s ease-in-out;
transform: scale(0.2);
opacity: 0;
}
.popup.scrolled { transform: scale(1); opacity: 1; }

/* This code is added by Rajnish , This is for logos scrolling  */

@keyframes scrollCompanies {
  100% {
    background-position: -3300px 0;
  }
}
/* Mobile Nav  */
.navbar-mobile {
margin: 0 !important;
border-radius: 0 !important;
}
.navbar.navbar-mobile {
animation: slideDown 0.8s forwards;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}


@media (max-width: 1400px) { /* fix for free quote button mobile  3-17/24 */
.navbar-mobile ul li:last-child { 
margin: -30px 0 0 0;
}
.add-on { 
border-top-width: 0!important; 
border-right-width: 0!important; 
border-bottom-width: 0!important; 
border-left-width: 0!important;
border-color: transparent;!important;
border-style: unset;!important;
}
.navbar .dropdown ul {
width: unset;  
}
.navbar-mobile .dropdown ul a {
padding: 20px 20px;
}
.navbar-mobile .dropdown ul  {
padding: 0
}
.navbar-mobile .dropdown ul {
    margin: 0 20px
}
.wwa {
  margin-top: -25px;
}
}
@media (max-width: 767px) { /* 5/15/24 */
.logo {
width: 55%;
height: auto;
}
.px-5 {
padding-right: 1.5rem!important;
padding-left: 1.5rem!important;
  }
}
/* contact */
.lt h2 span {
font-size: 1.5rem;
font-weight: 500;
letter-spacing: 0;
}
@media (max-width: 360px) { /* 10-2025 */
.dir p {
font-size: 1.2rem;
  }
}  
.alert p {
  font-size: 1.4rem;
  font-weight: normal;
  color: #fff;
  display: block;
  background-color: #B00020;
  border-radius: 10px;
  padding: 18px;
}

