.lfr-layout-structure-item-container {padding: 0;} .lfr-layout-structure-item-row {overflow: hidden;} .portlet-borderless .portlet-content {padding: 0;}.lfr-layout-structure-item-a4b0c3d4-1347-7bbd-62f0-f1d2cf72c12c {
padding-bottom: var(--spacer-2,0.5rem) !important;
padding-left: var(--spacer-2,0.5rem) !important;
padding-right: var(--spacer-2,0.5rem) !important;
}
.lfr-layout-structure-item-9960a66f-9cac-9f8c-3731-d46b1a591c56 {
height: 1.75rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 1.75rem !important;
}
.lfr-layout-structure-item-0346e2fb-6ee6-f418-c1a6-b5f3ff719ea7 {

}

.lfr-layout-structure-item-0346e2fb-6ee6-f418-c1a6-b5f3ff719ea7 img {
width: 100%;
height: 5vh;
}.lfr-layout-structure-item-92f8fa04-57f1-ee2f-7c77-e22df358eaaf {
color: var(--success) !important;
}
.lfr-layout-structure-item-92f8fa04-57f1-ee2f-7c77-e22df358eaaf {
font-style: italic;
text-align: center;
font-size: 1rem;
}.lfr-layout-structure-item-0d97b21f-825a-1681-346f-f16a87eb5bff {
padding-left: var(--spacer-2,0.5rem) !important;
padding-right: var(--spacer-2,0.5rem) !important;
color: var(--brand-color-1) !important;
}
.lfr-layout-structure-item-8abe7609-f8a8-dddf-f596-7a708e08de8a {
background-color: var(--gray-500) !important;
background-position: 50% 50%; background-repeat:no-repeat; background-size: cover; background-image: var(--lfr-background-image-8abe7609-f8a8-dddf-f596-7a708e08de8a) !important;
border-style: solid; border-width: 0 !important; border-width: 0px !important;
padding-bottom: var(--spacer-10,10rem) !important;
padding-top: var(--spacer-10,10rem) !important;
text-align: center !important;
}
.lfr-layout-structure-item-40f53ada-9962-d15a-ecd8-b3a03393e6db {
overflow: visible !important;
text-align: center !important;
}
.lfr-layout-structure-item-479515a6-2e12-7d22-113b-1a3d7f68b177 .gear-bg {
  width: 100%;
  min-height: 100vh; /* full screen */
  background-color: #f1f2f7;
  --base-color: #f1f2f7;

  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;

  overflow: hidden;
  position: relative;
}

/* BIG loader container */
.lfr-layout-structure-item-479515a6-2e12-7d22-113b-1a3d7f68b177 .gear-loader {
  width: 500px;
  height: 500px;
  position: relative;
}

/* BIG GEAR */
.lfr-layout-structure-item-479515a6-2e12-7d22-113b-1a3d7f68b177 .gear-loader::before {
  content: '';
  position: absolute;
  width: 300px;
  height: 300px;
  top: 80px;
  left: 60px;
  border-radius: 50%;
  background: #70A27F90;

  background-image:
    radial-gradient(circle 60px at 150px 150px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 150px 0px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 0px 150px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 300px 150px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 150px 300px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 250px 40px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 250px 250px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 40px 250px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 20px at 40px 40px, var(--base-color) 100%, transparent 0);

  background-repeat: no-repeat;
  animation: rotationBack 6s linear infinite;
}

/* SMALL GEAR */
.lfr-layout-structure-item-479515a6-2e12-7d22-113b-1a3d7f68b177 .gear-loader::after {
  content: '';
  position: absolute;
  width: 200px;
  height: 200px;
  top: 200px;
  left: 260px;
  border-radius: 50%;
  background: #70A27F90;

  background-image:
    radial-gradient(circle 40px at 100px 100px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 100px 0px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 0px 100px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 200px 100px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 100px 200px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 170px 20px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 170px 170px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 20px 170px, var(--base-color) 100%, transparent 0),
    radial-gradient(circle 12px at 20px 20px, var(--base-color) 100%, transparent 0);

  background-repeat: no-repeat;
  animation: rotationBack 8s linear infinite reverse;
}

/* TEXT */
.lfr-layout-structure-item-479515a6-2e12-7d22-113b-1a3d7f68b177 .coming-text {
  position: absolute;
  text-align: center;
}

.lfr-layout-structure-item-479515a6-2e12-7d22-113b-1a3d7f68b177 .coming-text h1 {
  font-size: 48px;
  margin-bottom: 10px;
  color: #333;
}

.lfr-layout-structure-item-479515a6-2e12-7d22-113b-1a3d7f68b177 .coming-text p {
  font-size: 18px;
  color: #666;
}

/* ANIMATION */
@keyframes rotationBack {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}.lfr-layout-structure-item-5458d452-f9dc-5dfd-a1e3-d59032b75e17 {
height: 1.75rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 1.75rem !important;
}
.lfr-layout-structure-item-42221c29-5480-dd2f-e68a-e8cd4880939f {
overflow: hidden !important;
}
.lfr-layout-structure-item-42221c29-5480-dd2f-e68a-e8cd4880939f {

}

.lfr-layout-structure-item-42221c29-5480-dd2f-e68a-e8cd4880939f img {
object-fit: cover;
}
.lfr-layout-structure-item-7eba6af4-fc92-87dd-db7f-06b299243fd5 {
overflow: visible !important;
}
.lfr-layout-structure-item-f0057f91-923f-48da-db36-ed02cd9f51fd {
height: 8rem !important;
padding-bottom: var(--spacer-2,0.5rem) !important;
padding-left: var(--spacer-3,1rem) !important;
padding-right: var(--spacer-3,1rem) !important;
padding-top: var(--spacer-2,0.5rem) !important;
width: 100% !important;
}
.lfr-layout-structure-item-ba77990a-fc3a-c874-0ad9-7f00bf407aa5 {
overflow: hidden !important;
}
.lfr-layout-structure-item-ba77990a-fc3a-c874-0ad9-7f00bf407aa5 {
width: 100%;
height: 700px;
}

/* From Uiverse.io by yeisonordonez */ 
.car-container {
  position: absolute;
  width: 400px;
  height: 400px;
  margin: auto;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.car {
  position: absolute;
  background-color: rgb(204, 204, 204);
  width: 200px;
  height: 120px;
  left: 50px;
  border-top: 4px solid rgb(162, 162, 162);
  top: 135px;
  animation: bounce 0.4s infinite;
}

@keyframes bounce {
  0% {
    top: 135px;
  }
  50% {
    top: 132px;
  }
}

.car::before {
  content: "";
  position: absolute;
  width: 290px;
  height: 20px;
  background-color: rgb(46, 46, 81);
  bottom: -10px;
}

.car::after {
  content: "";
  position: absolute;
  background-color: rgb(229, 229, 229);
  width: 80px;
  height: 90px;
  right: -90px;
  bottom: 10px;
  clip-path: polygon(0% 0%, 50% 0, 100% 60%, 100% 100%, 0% 100%);
}

.window {
  position: absolute;
  background-color: rgb(126, 191, 226);
  width: 50px;
  height: 40px;
  right: -75px;
  top: 26px;
  z-index: 1;
  clip-path: polygon(0% 0%, 40% 0, 100% 100%, 0% 100%);
  border: 2px solid rgb(135, 135, 135);
}

.window::before {
  content: "";
  position: absolute;
  background-color: rgb(186, 225, 247);
  width: 5px;
  height: 40px;
  left: 5px;
  transform: skew(-36deg);
  box-shadow: 9px 0px rgb(186, 225, 247);
}
.window::after {
  content: "";
  position: absolute;
  background-color: rgb(108, 107, 107);
  width: 10px;
  height: 10px;
  bottom: 2px;
  right: 10px;
  box-shadow:
    2px 6px 0px -2px rgb(229, 229, 229),
    inset 2px 0px rgb(203, 203, 204);
}

.wheels {
  position: absolute;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background-color: #bcbcbc;
  border: 10px solid rgb(4, 4, 4);
  bottom: 108px;
  left: 90px;
  box-shadow: 0px 0px 0px 4px;
  animation: rotation 0.3s linear infinite;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.wheels::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  background-color: rgb(67, 67, 67);
  top: 10px;
  left: 3px;
  border-radius: 50%;
  box-shadow:
    14.5px 0px rgb(67, 67, 67),
    7px -7px rgb(67, 67, 67),
    7px 7px rgb(67, 67, 67),
    7px 0px 0px 4px rgb(67, 67, 67);
  animation: name duration timing-function delay iteration-count direction
    fill-mode;
}

.wheels2 {
  left: 270px;
}

.cargo-details {
  position: absolute;
  width: 185px;
  height: 20px;
  background-color: #e9e9e9;
  left: 8px;
  top: 5px;
  box-shadow:
    0px 23px #e9e9e9,
    0px 46px #e9e9e9,
    0px 69px #e9e9e9;
}

.cargo-details::before {
  position: absolute;
  content: "";
  width: 10px;
  height: 4px;
  background-color: red;
  bottom: -72px;
  box-shadow:
    10px 0px white,
    20px 0px red,
    30px 0px white,
    40px 0px red,
    50px 0px white,
    60px 0px red,
    70px 0px white,
    80px 0px red,
    90px 0px white,
    100px 0px red,
    110px 0px white,
    120px 0px red,
    130px 0px white,
    140px 0px red,
    150px 0px white,
    160px 0px red,
    170px 0px white,
    175px 0px red;
}

.cargo-details::after {
  position: absolute;
  content: "";
  width: 10px;
  height: 6px;
  background-color: rgb(135, 135, 135);
  top: -6px;
  left: -10px;
  box-shadow:
    195px 0px rgb(135, 135, 135),
    0px 125px rgb(46, 46, 81);
}

.door {
  position: absolute;
  width: 10px;
  height: 4px;
  background-color: black;
  right: -31px;
  bottom: 40px;
  z-index: 2;
}

.door::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 20px;
  background-color: rgb(85, 84, 85);
  left: -21px;
  z-index: -1;
  bottom: -30px;
  box-shadow: inset 0px 4px rgb(163, 163, 163);
}

.lights {
  position: absolute;
  width: 12px;
  height: 20px;
  background-color: rgb(255, 237, 191);
  right: -90px;
  bottom: 0px;
  z-index: 1;
  box-shadow: inset 0px -8px rgba(172, 2, 2, 0.719);
  animation: lighting1 1.5s infinite ease-in-out;
}

@keyframes lighting1 {
  0% {
    background-color: rgb(255, 237, 191);
    box-shadow: inset 0px -8px rgba(172, 2, 2, 0.719);
  }

  50% {
    box-shadow: inset 0px -8px rgba(217, 83, 1, 0.719);
  }
}

.lights::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 15px;
  background-color: rgb(207, 2, 2);
  left: -280px;
  bottom: 0px;
  box-shadow: inset 0px 7px rgb(207, 2, 2);
  animation: lighting 1.5s infinite ease-in-out;
}

@keyframes lighting {
  0% {
    box-shadow: inset 0px 9px rgb(207, 2, 2);
  }

  50% {
    box-shadow: inset 0px 9px rgb(255, 0, 0);
  }
}

.lights::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 2px;
  background-color: rgb(81, 81, 81);
  top: -8px;
  box-shadow:
    0px -6px rgb(81, 81, 81),
    0px -12px rgb(81, 81, 81);
  right: 0px;
}

.street {
  height: 2px;
  width: 70px;
  background-color: black;
  position: absolute;
  bottom: 105px;
  left: 0;
  box-shadow:
    90px 0,
    180px 0,
    270px 0,
    360px 0;
  animation: motion 2s linear infinite;
}

.street::before {
  content: "";
  height: 2px;
  width: 70px;
  background-color: black;
  position: absolute;
  bottom: 0;
  left: 450px;
  box-shadow:
    90px 0,
    180px 0,
    270px 0,
    360px 0;
}

.street2 {
  position: absolute;
  height: 20px;
  width: 100%;
  background-color: #bcbcbc;
}

@keyframes motion {
  0% {
    left: 0;
  }
  100% {
    left: -450px;
  }
}

.post {
  position: absolute;
  width: 5px;
  height: 180px;
  background-color: black;
  right: -15px;
  top: 115px;
  animation: moving 2.9s infinite linear;
  z-index: -2;
}

@keyframes moving {
  0% {
    transform: translateX(0px);
  }
  100% {
    transform: translateX(-650px);
  }
}

.post::before {
  width: 20px;
  height: 20px;
  position: absolute;
  content: "";
  background-color: black;
  top: -15px;
  left: -7px;
  clip-path: polygon(0% 0%, 100% 0%, 80% 100%, 20% 100%);
}

.post::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-bottom: 20px solid transparent;
  border-left: 10px solid transparent;
  border-left: 20px solid black;
  transform: rotate(45deg);
  top: -23px;
  left: -7px;
}
.lfr-layout-structure-item-082c368d-c018-a444-0fa2-a75b738153d2 {
height: 1.75rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 1.75rem !important;
}
.lfr-layout-structure-item-b8331c4c-6d6a-ab49-3d97-14ef80027c9d {
background-position: 50% 50%; background-repeat:no-repeat; background-size: cover; background-image: var(--lfr-background-image-b8331c4c-6d6a-ab49-3d97-14ef80027c9d) !important;
padding-bottom: var(--spacer-4,1.5rem) !important;
padding-left: var(--spacer-4,1.5rem) !important;
padding-right: var(--spacer-4,1.5rem) !important;
padding-top: var(--spacer-4,1.5rem) !important;
}
/* Container wrapper with placeholder */
.lfr-layout-structure-item-31fdbb14-8fd3-e40b-b02d-ca40a8c3db1c {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 100px;
    overflow: hidden;
}

/* Animated gradient background */
.lfr-layout-structure-item-31fdbb14-8fd3-e40b-b02d-ca40a8c3db1c::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 200%;
    height: 100%;
    background: linear-gradient(270deg, #003366, #0055a5, #0073e6, #003366);
    background-size: 400% 400%;
    animation: gradientMove 10s ease infinite;
    z-index: -1;
}

/* Text animation: tracking-in */
.lfr-layout-structure-item-31fdbb14-8fd3-e40b-b02d-ca40a8c3db1c .animated-text.tracking-in-contract-bck-top {
    font-size: 3rem;
    font-weight: bold;
    color: white;
    opacity: 0;
    text-align: center;
    animation: tracking-in-contract-bck-top 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) forwards;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}

/* Tracking-in-contract-bck-top animation */
@keyframes tracking-in-contract-bck-top {
    0% {
        letter-spacing: 1em;
        transform: translateZ(400px) translateY(-300px);
        opacity: 0;
    }
    40% {
        opacity: 0.6;
    }
    100% {
        letter-spacing: normal;
        transform: translateZ(0) translateY(0);
        opacity: 1;
    }
}

/* Gradient animation */
@keyframes gradientMove {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Responsive */
@media (max-width: 768px) {
    .lfr-layout-structure-item-31fdbb14-8fd3-e40b-b02d-ca40a8c3db1c .animated-text.tracking-in-contract-bck-top {
        font-size: 2rem;
    }
}.lfr-layout-structure-item-01d46963-0171-d3b4-4811-5c77a8d41018 {
text-align: center !important;
color: var(--success) !important;
}
.lfr-layout-structure-item-01d46963-0171-d3b4-4811-5c77a8d41018 {
font-style: italic;
text-align: center;
font-size: 1rem;
}.lfr-layout-structure-item-a9a8921f-2062-f26e-291a-cc2d2fcb2f36 {
height: 1.75rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 1.75rem !important;
}
.lfr-layout-structure-item-2d993ba9-85e8-fa85-8133-ababd6a21425 {
height: 3rem !important;
min-height: 3rem !important;
width: 100% !important;
}
.lfr-layout-structure-item-77905726-c95f-ca6e-a372-f37fb79f5a18 {
margin-bottom: var(--spacer-1,0.25rem) !important;
margin-top: var(--spacer-1,0.25rem) !important;
width: 25% !important;
}
.lfr-layout-structure-item-77905726-c95f-ca6e-a372-f37fb79f5a18 {
margin-right: auto;
}.lfr-layout-structure-item-04df6813-016b-50e4-b569-339eaa72ef87 {
height: 100% !important;
max-height: 5rem !important;
min-height: 5rem !important;
}
.lfr-layout-structure-item-e2ced0b8-3edd-3d77-d133-f34f767d5c16 {
height: 100% !important;
max-height: 5rem !important;
min-height: 5rem !important;
}
.lfr-layout-structure-item-cfd4f487-77c9-4dc6-b491-ffc7a31a5411 {
height: 1.75rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 1.75rem !important;
}
.lfr-layout-structure-item-a682cdae-cb0e-272c-73ce-17ebed373c3f {
font-size: var(--font-size-base) !important;
font-weight: var(--font-weight-bold) !important;
height: 3rem !important;
min-height: 3rem !important;
overflow: visible !important;
text-align: center !important;
color: var(--white) !important;
}
.lfr-layout-structure-item-a682cdae-cb0e-272c-73ce-17ebed373c3f {
display: flex;
align-items: center;
}

.lfr-layout-structure-item-a682cdae-cb0e-272c-73ce-17ebed373c3f {
padding: 0 10px;
text-transform: uppercase;
font-family: 'Roboto', sans-serif;
font-size: 1rem;
align-items: center;
}

.lfr-layout-structure-item-a682cdae-cb0e-272c-73ce-17ebed373c3f li:hover {
color: black;
}

.navbar-nav .dropdown-menu {
border: none;
border-radius: 8px;
padding: 10px 0;
font-size: 0.8rem;
  margin-top: 0 !important;
  top: 100%;
}

.navbar-nav .dropdown-menu .dropdown-item {
color: #000000;
padding: 10px 20px;
transition: background 0.5s ease;
}

.navbar-nav .dropdown-menu .dropdown-item:hover {
background: linear-gradient(90deg, #1f4d20, #70a27f, #70a27f, #70a27f);
color: #FFFFFF;
font-weight: bold;
}.lfr-layout-structure-item-99b88b73-800a-e4b8-a370-f89f90121db8 {
height: 5rem !important;
margin-left: var(--spacer-1,0.25rem) !important;
margin-right: var(--spacer-1,0.25rem) !important;
max-height: 5rem !important;
min-height: 5rem !important;
overflow: hidden !important;
width: 75% !important;
}
.lfr-layout-structure-item-53d8e84e-77f8-4cb0-865d-99bb5581c154 {
height: 2rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 2rem !important;
}
.lfr-layout-structure-item-ae86a9e0-000f-58f1-2e17-9aae720b56cf {
overflow: hidden !important;
}
.lfr-layout-structure-item-ae86a9e0-000f-58f1-2e17-9aae720b56cf {
scale: 0.75;
}.lfr-layout-structure-item-96085656-13bc-1350-9a3d-92f4b49b1257 {
height: 2rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 2rem !important;
}
.lfr-layout-structure-item-1ba1cb80-2135-b63b-7cb3-90b075610bc5 {
padding-bottom: var(--spacer-2,0.5rem) !important;
padding-left: var(--spacer-2,0.5rem) !important;
padding-right: var(--spacer-2,0.5rem) !important;
padding-top: var(--spacer-2,0.5rem) !important;
}
.lfr-layout-structure-item-1ba1cb80-2135-b63b-7cb3-90b075610bc5 {
border-radius: 20px 20px 20px 20px;
box-shadow: rgba(0, 0, 0, 0.35) 5px 5px 10px;
background: linear-gradient(90deg, #1f4d2030, #70a27f30, #70a27f30, #70a27f30, #70a27f30, #1f4d2030);
}.lfr-layout-structure-item-f1c921b4-e26e-f0b9-e2b8-25778b6b4694 {

}
.lfr-layout-structure-item-f1c921b4-e26e-f0b9-e2b8-25778b6b4694 img {
object-fit: cover;
overflow: hidden;
}.lfr-layout-structure-item-067da039-859c-887d-22d2-fcd3cd451f1a {
display: none !important;
overflow: hidden !important;
}
.lfr-layout-structure-item-3acefab2-90ff-47ff-9c4d-a856ed63b708 {
height: 100% !important;
max-height: 5rem !important;
min-height: 5rem !important;
}
.lfr-layout-structure-item-d59f04ea-184e-0f44-ea7e-d24082a0893c {
color: var(--success) !important;
}
.lfr-layout-structure-item-d59f04ea-184e-0f44-ea7e-d24082a0893c {
font-style: italic;
text-align: center;
font-size: 1rem;
}.lfr-layout-structure-item-c38bf93f-6ff4-d48c-d651-862a0bf632a5 {
overflow: hidden !important;
}
.lfr-layout-structure-item-c38bf93f-6ff4-d48c-d651-862a0bf632a5 {

}

.lfr-layout-structure-item-c38bf93f-6ff4-d48c-d651-862a0bf632a5.vertical-ticker {
animation-name: ticker-scroll;
animation-duration: 30s;
animation-iteration-count: infinite;
}

@keyframes ticker-scroll {
0%,20%   { transform: translateY(0); }
33%,53%  { transform: translateY(-5rem); }
66%,86%  { transform: translateY(-10rem); }
100%     { transform: translateY(0); }
}.lfr-layout-structure-item-11508786-e9b1-d3f1-76e6-9049f9c12b77 {
  /*  background: linear-gradient(220deg, #ffffff, #bee3a5, #e6eee1, #ffffff);
    background-size: 800% 800%;

    -webkit-animation: AnimationName 32s ease infinite;
    -moz-animation: AnimationName 32s ease infinite;
    animation: AnimationName 32s ease infinite;*/
  
}


/*@-webkit-keyframes AnimationName {
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}
@keyframes AnimationName {
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}*/

.lfr-layout-structure-item-0fa23a0e-e5b1-8d8d-bdf1-fb6442297f4e {
height: 2rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 2rem !important;
}
.lfr-layout-structure-item-cd956589-1923-fc8f-bdd9-8dd9755486e1 {

}
.lfr-layout-structure-item-cd956589-1923-fc8f-bdd9-8dd9755486e1 img {
object-fit: cover;
overflow: hidden;
}.lfr-layout-structure-item-0246ef97-6941-f606-a7ab-8d74e1a4854f {
height: 2rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 2rem !important;
}
.lfr-layout-structure-item-e3c6aef2-9ddd-bbcf-dfc5-52542d438d08 {
font-size: var(--font-size-base) !important;
font-weight: var(--font-weight-bold) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
color: var(--brand-color-4) !important;
}
.lfr-layout-structure-item-e3c6aef2-9ddd-bbcf-dfc5-52542d438d08 {

}

.fa-solid {
color: #F0B800;
}

.lfr-layout-structure-item-e3c6aef2-9ddd-bbcf-dfc5-52542d438d08 p {
font-size: 1rem;
padding-bottom: 0.5rem;
}.lfr-layout-structure-item-a20e2eb0-ddad-d948-1fbd-a6717016323d {
margin-right: var(--spacer-1,0.25rem) !important;
overflow: visible !important;
}
.lfr-layout-structure-item-544ae4ae-5d26-8386-730e-ab7f2ce4514a {
background-position: 50% 50%; background-repeat:no-repeat; background-size: cover; background-image: var(--lfr-background-image-544ae4ae-5d26-8386-730e-ab7f2ce4514a) !important;
margin-bottom: var(--spacer-1,0.25rem) !important;
margin-top: var(--spacer-1,0.25rem) !important;
min-width: 25rem !important;
width: 25rem !important;
}
.lfr-layout-structure-item-d70290d2-3ce9-a09e-569c-9408cab97ffd {
  width: 100%;
}

.crane-card {
  width: 90%;
height: 100%;
  margin: 40px auto;
  padding: 5px;
  border-radius: 20px;

  background: transparent; /* 👈 keep it transparent */

  /* keep the floating feel */
  box-shadow: 
    0 10px 25px rgba(0,0,0,0.08),
    0 4px 10px rgba(0,0,0,0.04);

  border: 1px solid rgba(0,0,0,0.05); /* subtle edge */

  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hover lift effect */
.crane-card:hover {
  transform: translateY(-6px);
  box-shadow: 
    0 18px 35px rgba(0,0,0,0.15),
    0 8px 15px rgba(0,0,0,0.08);
}

.crane-scene {
  width: 100%;
  height: 390px;
  background: linear-gradient(#e6f2ff, #ffffff);
  display: flex;
  justify-content: center;
  align-items: flex-end;
  overflow: hidden;
   position: relative;
  padding-top: 100px;
}

.crane-scene::before {
  content: "";
  position: absolute;
  top: 20px;
  right: 380px; /* control sun position from left side */
  width: 90px;
  height: 90px;
  background: radial-gradient(circle, #fff4b0, rgba(255,244,176,0.3), transparent 70%);
  border-radius: 50%;
  z-index: 0;
}

.ground {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 30px;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  
  /* soft construction ground feel */
  /* soft construction ground feel */
  background: linear-gradient(
    to top,
    rgba(31, 77, 32, 0.28),
    rgba(31, 77, 32, 0.08),
    transparent
  );

  z-index: 1;
  pointer-events: none;
}

.coming-soon {
  position: absolute;
  top: 12px;
  left: 70px;
  z-index: 20;
}

.coming-soon h2 {
  font-size: 50px;
  color: #1F4D20;
  padding: 6px 12px;
}

.coming-soon p {
  font-size: 28px;
  color: #6b7280;
}
/* CLOUDS*/
.cloud {
  position: absolute;
  top: 40px;
  width: 120px;
  height: 50px;
  background: rgba(255,255,255,0.95);
  border-radius: 50px;

  /* 👇 key improvement */
  box-shadow: 
    0 8px 18px rgba(0,0,0,0.08),
    0 2px 6px rgba(0,0,0,0.05);

  filter: blur(1px); /* reduce blur so shape is clearer */
  z-index: 1;
  
  
}

.cloud::before,
.cloud::after {
  content: "";
  position: absolute;
  background: rgba(255,255,255,0.95);
  border-radius: 50%;

  /* 👇 gives the fluffy stacked look */
  box-shadow: 0 6px 12px rgba(0,0,0,0.06);
}

.cloud::before {
  width: 60px;
  height: 60px;
  top: -20px;
  left: 10px;
}

.cloud::after {
  width: 80px;
  height: 80px;
  top: -30px;
  right: 10px;
  opacity: 0.7;
}

/* movement */
.cloud1 {
  left: -150px;
  animation: cloudMove 30s linear infinite;
}

.cloud2 {
  left: -200px;
  top: 80px;
  animation: cloudMove 45s linear infinite;
}

.cloud3 {
  left: -180px;
  top: 20px;
  transform: scale(0.8);
  animation: cloudMove 28s linear infinite;
}

.cloud4 {
  left: -300px;
  top: 120px;
  transform: scale(1.2);
  animation: cloudMove 55s linear infinite;
}

.cloud5 {
  left: -220px;
  top: 60px;
  transform: scale(0.6);
  opacity: 0.6;
  animation: cloudMove 40s linear infinite;
}

@keyframes cloudMove {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(1600px);
  }
}

/* Crane container */
.crane {
  position: relative;
  isolation: isolate; 
  width: 600px;
  height: 100%;
  
}

/* Tower */
.tower {
  position: absolute;
  bottom: 38px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 205px;
  background: #444;
   z-index: 2;
}

/* Base */
.base {
  position: absolute;
  bottom: 0;
  width: 80px;
  height: 40px;
  background: #333;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 5px;
  z-index: 1;
}

/* 👇 Half circle joint */
.tower::after {
  content: "";
  position: absolute;
  top: -15px; /* sits on top of tower */
  left: 50%;
  transform: translateX(-50%);
  width: 42px;
  height: 20px;
  background: #555;
  border-radius: 20px 20px 0 0; /* half circle */
}

/* Arm */
.arm {
  position: absolute;
  z-index: 3;
  top: 40px;
  left: 50%;
  width: 200px;
  height: 10px;
  background: #555;
  border-radius: 2px;
  transform-origin: left center;
  animation: armSwing 4s ease-in-out infinite alternate;
}

/* Trolley (moves left & right) */
.trolley {
  position: absolute;
  top: -6px;
  width: 40px;
  height: 20px;
  background: #1F4D20;
  animation: moveTrolley 4s ease-in-out infinite alternate;
}

/* Cable */
.cable {
  position: absolute;
  top: 12px;
  left: 50%;
  width: 2px;
  height: 100px;
  background: #222;
  transform: translateX(-50%);
  animation: cableMove 2s ease-in-out infinite alternate;
}

/* Hook */
.hook {
  width: 12px;
  height: 12px;
  border: 3px solid #000;
  border-top: none;
  border-radius: 0 0 50% 50%;
  position: absolute;
  bottom: -12px;
  left: 50%;
  transform: translateX(-50%);
}

/* Load container */
.load {
  position: relative;
  top: 6px;
  left: 50%;
  transform: translateX(0%);
   z-index: 10; /* higher than base */
}

/* Screen (like your image) */
.screen {
  width: 150px;
  height: 110px;
  background: #dbe7f6;
  border-radius: 12px;
  padding: 15px;
  box-shadow: 0 8px 15px rgba(0,0,0,0.15);
  animation: sway 2s ease-in-out infinite alternate;
  position: relative;
  z-index: 10; /* higher than base */
}

.img-box {
  width: 64px;
  height: 64px;
  position: relative;
  background: #FFF;
  border-radius: 4px;
  overflow: hidden;
}

.img-box:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 40px;
  height: 40px;
  transform: rotate(45deg) translate(30%, 40%);
  background: #A9D3A8;   /* light vibrant green */
  box-shadow: 32px -34px 0 5px #1F4D20;
  animation: slide 2s infinite ease-in-out alternate;
}


.img-box:after {
  content: "";
  position: absolute;
  left: 10px;
  top: 10px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #1F4D20;
  transform: rotate(0deg);
  transform-origin: 35px 145px;
  animation: rotate 2s infinite ease-in-out;
}

@keyframes slide {
  0% , 100% {
    bottom: -35px
  }

  25% , 75% {
    bottom: -2px
  }

  20% , 80% {
    bottom: 2px
  }
}

@keyframes rotate {
  0% {
    transform: rotate(-15deg)
  }

  25% , 75% {
    transform: rotate(0deg)
  }

  100% {
    transform: rotate(25deg)
  }
}

/* Text lines */
.text-line {
  height: 6px;
  background: #b5c7e3;
  border-radius: 4px;
  margin-bottom: 5px;
}

.text-line.short {
  width: 50%;
  margin-top: 3px;
}

.text-line.long {
  width: 90%;
}

/* Slight swinging motion */
@keyframes sway {
  0% {
    transform: translateX(-50%) rotate(-2deg);
  }
  100% {
    transform: translateX(-50%) rotate(2deg);
  }
}

/* Animations */

/* Arm slight swing */
@keyframes armSwing {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(3deg);
  }
}

/* Trolley moves horizontally */
@keyframes moveTrolley {
  0% {
    left: 10%;
  }
  100% {
    left: 80%;
  }
}

/* Cable up/down */
@keyframes cableMove {
  0% {
    height: 60px;
  }
  100% {
    height: 100px;
  }
}.lfr-layout-structure-item-f6fcdb54-99a2-9882-d164-325e49034238 {
color: var(--brand-color-3) !important;
}
.lfr-layout-structure-item-f6fcdb54-99a2-9882-d164-325e49034238 {

}

.lfr-layout-structure-item-f6fcdb54-99a2-9882-d164-325e49034238 iframe {
aspect-ratio: 1/1;
max-height: 15rem;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}.lfr-layout-structure-item-24277775-4e7f-bccb-6630-b7576d382363 {
padding-left: var(--spacer-2,0.5rem) !important;
padding-right: var(--spacer-2,0.5rem) !important;
color: var(--brand-color-1) !important;
}
.lfr-layout-structure-item-2fc35bb1-608d-10f3-adb4-579b4bce1406 {
height: 2rem !important;
margin-bottom: var(--spacer-2,0.5rem) !important;
margin-left: var(--spacer-2,0.5rem) !important;
margin-right: var(--spacer-2,0.5rem) !important;
margin-top: var(--spacer-2,0.5rem) !important;
width: 2rem !important;
}
.lfr-layout-structure-item-aef34a2c-dade-47aa-2ad2-acb27b9af1f0 {
border-style: solid; border-width: 0 !important; border-width: 0px !important;
padding-left: var(--spacer-10,10rem) !important;
padding-right: var(--spacer-10,10rem) !important;
}
.lfr-layout-structure-item-3ced1414-3614-6096-4fff-7efb0f218eb2 {
margin-left: var(--spacer-1,0.25rem) !important;
margin-right: var(--spacer-1,0.25rem) !important;
overflow: visible !important;
text-align: center !important;
}
.lfr-layout-structure-item-3ced1414-3614-6096-4fff-7efb0f218eb2 {
background: linear-gradient(90deg, #1f4d20, #70a27f, #70a27f, #70a27f, #70a27f, #1f4d20);
border-radius: 20px 20px 0px 0px;
}


.lfr-layout-structure-item-07b1613d-b49b-d8e3-6d8f-941dd46e1945 {
display: none !important;
}
@media screen and (max-width: 991px) {.lfr-layout-structure-item-8abe7609-f8a8-dddf-f596-7a708e08de8a {
padding-left: var(--spacer-5,3rem) !important;
padding-right: var(--spacer-5,3rem) !important;
}
.lfr-layout-structure-item-99b88b73-800a-e4b8-a370-f89f90121db8 {
display: none !important;
}
.lfr-layout-structure-item-aef34a2c-dade-47aa-2ad2-acb27b9af1f0 {
padding-left: var(--spacer-5,3rem) !important;
padding-right: var(--spacer-5,3rem) !important;
}
}@media screen and (max-width: 767px) {.lfr-layout-structure-item-8abe7609-f8a8-dddf-f596-7a708e08de8a {
padding-left: var(--spacer-4,1.5rem) !important;
padding-right: var(--spacer-4,1.5rem) !important;
}
.lfr-layout-structure-item-77905726-c95f-ca6e-a372-f37fb79f5a18 {
display: none !important;
}
.lfr-layout-structure-item-e2ced0b8-3edd-3d77-d133-f34f767d5c16 {
display: block !important;
}
.lfr-layout-structure-item-99b88b73-800a-e4b8-a370-f89f90121db8 {
display: none !important;
}
}@media screen and (max-width: 575px) {.lfr-layout-structure-item-8abe7609-f8a8-dddf-f596-7a708e08de8a {
padding-left: var(--spacer-3,1rem) !important;
padding-right: var(--spacer-3,1rem) !important;
}
.lfr-layout-structure-item-77905726-c95f-ca6e-a372-f37fb79f5a18 {
display: none !important;
}
.lfr-layout-structure-item-e2ced0b8-3edd-3d77-d133-f34f767d5c16 {
display: block !important;
}
.lfr-layout-structure-item-aef34a2c-dade-47aa-2ad2-acb27b9af1f0 {
padding-left: var(--spacer-0,0rem) !important;
padding-right: var(--spacer-0,0rem) !important;
}
}