.mla {
  margin-left: auto;
}
.mra {
  margin-right: auto;
}
.fdc {
  flex-direction: column;
}
.nw {
  flex-wrap: nowrap;
}
.fw {
  flex-wrap: wrap;
}
.df {
  display: flex;
}
.tac {
  text-align: center;
}
.tal {
  text-align: left;
}

@media (min-width: 290px) and (max-width: 1199px) {
.hmbutton {
    display: inline-block;
    min-width: 270px;
    color: white;
    text-align: center;
    font-size: 18px;
    line-height: 1.55;
    font-weight: 600;
    border-radius: 50px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 42px;
    margin-bottom: 30px;
}
.hmbutton2 {
    display: inline-block;
    min-width: 270px;
    color: white;
    text-align: center;
    font-size: 18px;
    line-height: 1.55;
    font-weight: 600;
    border-radius: 50px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 10px;
    margin-bottom: 30px;
}
  .hmbuttonc4c {
    display: inline-block;
    min-width: 280px;
    color: #1054ff;
    text-align: center;
    font-size: 22px;
    line-height: 1.2;
    font-weight: 600;
    border-radius: 50px;
    margin-right: auto;
    margin-left: auto;
    margin-top: -100px;
    margin-bottom: 30px;
    border: solid 2px;
}
.hmbutton2c4c {
    display: inline-block;
    min-width: 280px;
    color: white;
    text-align: center;
    font-size: 22px;
    line-height: 1.2;
    font-weight: 600;
    border-radius: 50px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 10px;
    margin-bottom: 30px;
}
}

.blbutton {
  transition: 0.2s all ease;
  background-color: #17408a;
}
.grnbutton {
  transition: 0.2s all ease;
  background-color: #43d168;
}
.blbuttonc4c {
  transition: 0.2s all ease;
  background-color: #fff;
}
.change:hover {
  transition: 0.2s all ease;
  background-color: #5483f7;;
}
.change2:hover {
  transition: 0.2s all ease;
  background-color: #e1d168;
}
.changec4c:hover {
  transition: 0.2s all ease;
  background-color: #f1f3fa;
}
.hr-link {
  color: #1f5bff;
  font-size: 20px;
  line-height: 1.55;
  font-weight: 700;
  margin-top: 20px;
}
.hr-link:hover {
  text-decoration: none;
}
.hr-container {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding: 0px 20px;
}
.hr-container2 {
  width: 100%;
  max-width: 800px;
  padding: 0px 20px;
}

@media (min-width: 568px) and (max-width: 767px) {
  .hr-container {
    padding: 0px 40px;
  }
}
@media (min-width: 568px) and (max-width: 767px) {
  .hr-container2 {
    padding: 0px 40px;
  }
}
@media (min-width: 768px) {
  .uberuns {
    max-width: 514px;
    padding-bottom: 10%;
  }
}
@media (min-width: 260px) and (max-width: 767px) {
  .uberuns {
    width: 100%;
    padding-bottom: 20px;
    padding-top: 20px;
  }
}
.hr-quote {
  background-size: 100% 100%;
  background-image: url(/content/landing/speech-bubble.png);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center;
  margin-top: 20px;
  margin-left: 50px;
  padding: 4% 14% 12% 5%;
}
.hr-quote2 {
  background-size: 100% 100%;
  background-image: url(/content/landing/speech-bubble.png);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center;
  margin-top: 20px;
  margin-left: 50px;
  padding: 4% 14% 12% 5%;
}
@media (max-width: 476px) {
  .hr-quote {
    padding: 4% 14% 20% 5%;
  }
    .hr-quote2 {
    padding: 4% 14% 33% 5%;
  }
}

.hr-bubble {
  background-color: #fff;
  padding: 30px 35px;
  border-radius: 10px;
  width: auto;
}
.hr-quote2-3 {
  padding-bottom: 60px;
}
.hr-quote i {
  width: 80%;
  font-size: 18px;
  line-height: 28px;
}
.hr-quote2 i {
  width: 80%;
  font-size: 18px;
  line-height: 28px;
}
.hr-worker {
  max-width: 146px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  overflow: hidden;
}
.ml10 {
  margin-left: 10px;
}
.mr10 {
  margin-right: 10px;
}
.hr-avatar {
  border-radius: 50%;
  overflow: hidden;
}


.deg45 {
  background: linear-gradient(45deg, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 1) 50%);
}
.deg315 {
  background: linear-gradient(315deg, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 1) 50%);
}


@media (min-width: 768px) {
  .bubble-tail {
    margin-top: 50px;
    width: 25px;
    height: 25px;
  }
}
@media (min-width: 280px) and (max-width: 767px) {
  .bubble-tail {
    margin-top: 25px;
    width: 15px;
    height: 15px;
  }
}


@media (min-width: 768px) {
  .hr-avatar {
    width: 100px;
    height: 100px;
  }
}
@media (min-width: 280px) and (max-width: 767px) {
  .hr-avatar {
    width: 50px;
    height: 50px;
  }
}
.hr-ico {
  width: 100px;
  height: auto;
  max-width: 100%;
  margin-bottom: 25px;
}
.hero-bkg1 {
  display: flex;
  background-size: cover;
  width: 100%;
  height: 960px;
  background-image: url(/content/landing/hero-autotransporter.jpg);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center;
}
.hr-bkg1 {
  display: flex;
  background-size: cover;
  width: 100%;
  height: 960px;
  background-image: url(/content/hrpage/hero1.jpg);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center;
}
@media (min-width: 768px) {
  .hero-bkg4 {
    background-size: cover;
    background-image: url(/content/landing/landing_bg_2.jpg);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 65% 50%;
  }
}
@media (min-width: 280px) and (max-width: 767px) {
  .hero-bkg4mob {
    background-size: cover;
    height: 900px;
    background-image: url(/content/landing/landing_bg_1.jpg);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 30% 0%;
  }
}
.hero-bkg4_2 {
  background: linear-gradient(90deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 50%);
}
.hero-bkg2 {
  width: 1003px;
  margin-left: auto;
  margin-top: auto;
}
.hero-bkg2c4c {
  width: 680px;
  margin-left: auto;
  margin-top: auto;
}
.hero-bkg3 {
  background-image: url(/content/landing/working.png);
  background-repeat: no-repeat;
}
.hr-bkg3 {
  background-image: url(/content/bild-removebg.png);
  background-repeat: no-repeat;
}
.main-text {
  font-weight: 700;
  color: #fff;
  display: flex;
  flex-direction: column;
}
.main-text * {
  color: #fff;
  margin-bottom: 33px;
  line-height: 1.2;
}
.main-text-hr {
  font-weight: 700;
  color: #fff;
  display: flex;
}
.main-textc4c {
  font-weight: 700;
  color: #fff;
  display: flex;
}

@media (min-width: 768px) {
  .hr-col33 {
    width: 29%;
    margin: 24px;
  }
  .hr-col50 {
    width: 50%;
  }
}

@media (min-width: 280px) and (max-width: 767px) {
  .hr-col33 {
    width: 100%;
    margin-bottom: 30px;
  }
  .hr-col50 {
    width: 100%;
  }
}

@media (min-width: 1200px) {
.hero-bkg2 {
    margin-right: 20%;
    background: linear-gradient(0deg, rgba(0, 81, 255, 0.6) 75%, rgba(255, 255, 255, 0) 75%);
}
  .hero-bkg2c4c {
    margin-right: 258px;
    background: linear-gradient(0deg, rgba(0, 81, 255, 0.6) 75%, rgba(255, 255, 255, 0) 75%);
  }
  .hero-bkg3 {
    background-size: 35%;
    min-height: 400px;
    background-position: 88% 100%;
  }
.hr-bkg3 {
    background-size: 92%;
    min-height: 400px;
    background-position: 50% 100%;
}
.main-text {
    padding: 27% 6% 20% 6%;
    max-width: 100%;
    font-size: 27px;
    line-height: 1.2;
}
    .main-text-hr {
    padding: 20% 2% 5% 3%;
    max-width: 69%;
    font-size: 30px;
    line-height: 1.2;
    margin-top: 40px;
  }
  .main-textc4c {
    padding: 30% 5% 5% 5%;
    max-width: 100%;
    font-size: 30px;
    line-height: 1.2;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .hero-bkg2 {
    background: rgba(0, 81, 255, 0.6);
  }
  .hero-bkg2c4c {
    background: rgba(0, 81, 255, 0.6);
  }
  .hero-bkg3 {
    background-size: 35%;
    min-height: 470px;
    background-position: 100% 100%;
  }
.hr-bkg3 {
    background-size: 84%;
    min-height: 470px;
    background-position: 50% 100%;
}
.main-text {
    padding: 7% 2% 245px 2%;
    max-width: 100%;
    font-size: 30px;
    line-height: 1.2;
}
    .main-text-hr {
    padding: 17% 2% 120px 4%;
    max-width: 85%;
    font-size: 30px;
    line-height: 1.2;
  }
  .main-textc4c {
    padding: 17% 4% 120px 4%;
    max-width: 100%;
    font-size: 30px;
    line-height: 1.2;
  }
}
@media (min-width: 280px) and (max-width: 767px) {
.hero-bkg2 {
    background: rgba(0, 81, 255, 0.6);
    margin-right: 0%;
    padding-top: 10%;
}
  .hero-bkg2c4c {
    background: rgba(0, 81, 255, 0.6);
    margin-right: 0%;
  }
  .hero-bkg3 {
    background-size: 213px;
    background-position: -80px 100%;
  }
.hr-bkg3 {
    background-size: 90%;
    background-position: 50% 100%;
}
.main-text {
    padding: 0% 2% 173px 2%;
    width: 100%;
    font-size: 23px;
    line-height: 1.2;
}
    .main-text-hr {
    padding: 20% 2% 120px 2%;
    width: 71%;
    font-size: 23px;
    line-height: 1.2;
    margin-left: auto;
  }
  .main-textc4c {
    padding: 30% 7% 113px 7%;
    width: 100%;
    font-size: 23px;
    line-height: 1.2;
    margin: auto;
  }
}
#hr-ban1 h3 {
  font-size: 42px;
  line-height: 1.23;
  font-weight: 600;
  margin-bottom: 30px;
}
#hr-ban1 p {
  font-size: 24px;
  line-height: 1.5;
  font-weight: 300;
  max-width: 560px;
  margin-bottom: 105px;
}
#hr-ban1 h4 {
  font-size: 30px;
  line-height: 1.17;
  font-weight: 600;
  margin-top: 12px;
  margin-bottom: 25px;
}
#hr-ban1 ul {
  padding-left: 20px;
}
#hr-ban1 li,
#hr-ban1 p {
  font-size: 16px;
  line-height: 1.55;
  font-weight: 300;
}
#hr-ban1 > .df.fw {
  justify-content: center;
}
#hr-ban1, #hr-ban4 {
  padding-top: 60px;
  padding-bottom: 60px;
}
#hr-ban4 {
  background-color: transparent;
}
#hr-ban5 {
  padding-top: 90px;
  padding-bottom: 60px;
}
#hr-ban3 {
  padding-top: 60px;
  padding-bottom: 60px;
}
#hr-ban2, #hr-ban5 {
  background-color: #ebebeb;
}
#hr-ban2 h3 {
  font-size: 52px;
  line-height: 62px;
  font-weight: 700;
}
#hr-ban2 h4 {
  font-size: 18px;
  line-height: 21px;
  font-weight: 400 !important;
}
#hr-ban2 p {
  font-size: 16px;
  line-height: 1.55;
  letter-spacing: 1px;
  font-weight: 300;
  text-align: left;
  margin-top: 19%;
  margin-bottom: 27%;
}
@media (max-width: 767px) {
  #hr-ban2 p {
    margin-top: 10%;
    margin-bottom: 15%;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  #hr-ban2 p {
    padding-left: 30px;
  }
}
#hr-ban3 .df {
  align-items: baseline;
}
#hr-ban3 h3 {
  font-size: 42px;
  line-height: 1.23;
  font-weight: 600;
  margin-bottom: 30px;
}
#hr-ban3 p {
  font-size: 17px;
  line-height: 1.5;
  font-weight: 300;
  margin-bottom: 14px;
}

#hr-ban3 li {

  background: url(/content/landing/hrmarkerfix.png) no-repeat 0px 0px transparent;
  list-style-type: none;
  margin: 0;
  padding: 0px 0px 1px 24px;
  vertical-align: middle;
  padding-left: 45px;
}

#hr-ban3 li p {
  font-size: 18px;
  line-height: 1.55;
  font-weight: 300;
  margin-bottom: 50px;
  max-width: 96%;
}

#hr-ban3 h4 {
  margin-top: 0px;
  font-size: 20px;
  line-height: 1.35;
  font-weight: 600;
  margin-bottom: 14px;
}
#hr-ban3 ul {
  padding-left: 0px;
}

#hr-ban3 img {
  margin: 50px 0;
}
#hr-ban4 h3 {
  font-size: 32px;
  line-height: 1.23;
  font-weight: 700;
  margin-bottom: 20px;
}
#hr-ban4 p {
  font-size: 24px;
  line-height: 1.5;
  font-weight: 300;
  max-width: 400px;
  margin-bottom: 60px;
}
#hr-ban4 li {

  background: url(/content/landing/hrmarkersmall.png) no-repeat 0px 0px transparent;
  list-style-type: none;
  margin: 0;
  padding: 0px 0px 1px 24px;
  vertical-align: middle;
  padding-left: 40px;
}

#hr-ban4 li p {
  margin-top: 0;
  font-size: 20px;
  line-height: 1.35;
  font-weight: 600;
  margin-bottom: 14px;
}

#hr-ban4 h4 {
  margin-top: 0;
  font-size: 25px;
  line-height: 1.35;
  font-weight: 600;
  margin-bottom: 25px;
}
#hr-ban4 .hr-link {
  display: block;
  text-align: center;
}
@media (min-width: 768px) {
  #hr-ban4 ul {
    padding-left: 0px;
    max-width: 84%;
  }
}

@media (min-width: 280px) and (max-width: 767px) {
  #hr-ban4 ul {
    padding-left: 0px;
    max-width: 100%;
  }
}


#hr-ban5 h3 {
  font-size: 42px;
  line-height: 1.23;
  font-weight: 700;
  margin-bottom: 90px;
}
#hr-ban5 h4 {
  font-size: 16px;
  line-height: 1.35;
  font-weight: 600;
  margin: 0px;
}

#hr-ban5 h5 {
  font-size: 14px;
  line-height: 1.55;
  margin: 0px;
  color: #666;
}

#hr-ban5 p {
  font-size: 15px;
  line-height: 1.55;
  font-weight: 300;
  margin-top: 8px;
}
.inner-wrap .container:has(.hero-bkg1) {
  width: 100% !important;
  padding: 0;
}
.inner-wrap .container:has(.hr-bkg1) {
  width: 100% !important;
  padding: 0;
}
.inner-wrap .container:has(.hero-cash1) {
  width: 100% !important;
  padding: 0;
}
.inner-wrap .container:has(.hero-vps1) {
  width: 100% !important;
  padding: 0;
}
.inner-wrap .container:has(.hero-jcb) {
  width: 100% !important;
  padding: 0;
}
.clear {
  margin: 0;
}
#hr-ban1 ul {
  text-align: left;
}

.hero-cash1 {
  display: flex;
  background-size: cover;
  width: 100%;
  height: 800px;
  background-image: url(/content/landing/c4chero1.jpg);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 50% 100%;
}
.hero-vps1 {
  display: flex;
  background-size: cover;
  width: 100%;
  height: 800px;
  background-image: url(/content/landing/vpshero1.jpg);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 50% 40%;
}
.hero-jcb {
  display: flex;
  background-size: cover;
  width: 100%;
  height: 950px;
  background-image: url(/content/landing/656a0723.jpg);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 50% 100%;
}
@media (min-width: 768px) {
  .hero-cash2 {
    background-size: cover;
    background-image: url(/content/landing/copartoffice3.jpg);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 65% 80%;
  }
}
@media (min-width: 280px) and (max-width: 767px) {
  .hero-cash2mob {
    background-size: cover;
    height: 900px;
    background-image: url(/content/landing/copartoffice3.jpg);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 80% 100%;
  }
}
.hr-bubble i {
  font-size: 15px;
  line-height: 1.55;
}

#hr-intro-text {
  padding-top: 0;
  padding-bottom: 0;
}
@media (min-width: 1200px) {
  #hr-intro-text {
    padding-top: 160px;
    padding-bottom: 60px;
  }
  .hmbutton {
    display: inline-block;
    min-width: 270px;
    color: white;
    text-align: center;
    font-size: 18px;
    line-height: 1.55;
    font-weight: 600;
    border-radius: 50px;
    margin-right: 30px;
    margin-left: auto;
    margin-top: -300px;
    position: sticky;
    position: -webkit-sticky;
    top: 20px;
    z-index: 5;
    margin-bottom: 120px;
  }
  .hmbutton2 {
display: inline-block;
    min-width: 270px;
    color: white;
    text-align: center;
    font-size: 18px;
    line-height: 1.55;
    font-weight: 600;
    border-radius: 50px;
    margin-right: 30px;
    margin-left: auto;
    margin-top: -98px;
    margin-bottom: 30px;
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
    z-index: 5;
  }
  .hmbuttonc4c {
    display: inline-block;
    min-width: 280px;
    color: #1054ff;
    text-align: center;
    font-size: 22px;
    line-height: 1.2;
    font-weight: 600;
    border-radius: 50px;
    margin-right: 3%;
    margin-left: auto;
    margin-top: -306px;
    margin-bottom: 30px;
	position: -webkit-sticky;
    position: sticky;
    top: 20px;
    border: solid 2px;
}
.hmbutton2c4c {
    display: inline-block;
    min-width: 280px;
    color: white;
    text-align: center;
    font-size: 22px;
    line-height: 1.2;
    font-weight: 600;
    border-radius: 50px;
    margin-right: 3%;
    margin-left: auto;
    margin-top: 10px;
    margin-bottom: 30px;
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
}
  #hr-ban1 {
    padding-top: 160px;
    padding-bottom: 60px;
  }
}
.hr-container h3 {
font-size: 42px;
    line-height: 1.23;
    font-weight: 600;
    margin-bottom: 30px;
}
.timeline {
  width: 100%;
  display: flex;
}

.timeline::before {
  content: "";
  position: relative;
  top: 0;
  bottom: 0;
  left: 49.9723%;
  width: 3px;
  background-color: #1254FF;
  z-index: 0;
}
.top-icon img {
width: 24px;
height: 24px;
position: relative;
margin-bottom: 50px;
}
.bottom-icon img {
width: 14px;
height: 14px;
position: relative;
margin-top: 50px;
}
.timeline-cnt {
width: 100%;
margin-bottom: 40px;
align-items: center;
flex-direction: row;
}
.timeline-text {
background-color: #FFF;
border-radius: 22px;
overflow: hidden;
padding: 24px 32px;
text-align: center;
width: 40%;
}
.timeline-text2 {
margin-top: 40px;
background-color: #FFF;
border-radius: 22px;
overflow: hidden;
padding: 24px 32px;
text-align: left;
width: 100%;
}
.timeline-text h4 {
padding-bottom: 20px;
}
.timeline-icon {
  position: relative;
  display: flex;
  top: 0;
  bottom: 0;
  left: 10.1%;
}
.timeline-icon img {
width: 112px;
height: 112px;
}
.tlico {
background-repeat: no-repeat;
background-position: center;
position: relative;
z-index: 1;
}
@media (min-width: 768px) {
#tlico1 {
background-image: url("/content/hrpage/appregistration.png");
}
#tlico2 {
background-image: url("/content/hrpage/contract-edit.png");
}
#tlico3 {
  background-image: url("/content/hrpage/mystery.png");
}
#tlico4 {
background-image: url("/content/hrpage/reviews.png");
}
#tlico5 {
background-image: url("/content/hrpage/payments.png");
}
.tlicomob {
display: none;
}
}
.timeline-bg {
background-color: #ebebeb;
padding-top: 20px;
padding-bottom: 40px;
}
@media (max-width: 767px) {
.tlico {
background-repeat: no-repeat;
background-position: 50% 0%;
position: relative;
z-index: 1;
}
.timeline-text {
position: relative;
width: 100%;
z-index: 0;
overflow: visible;
}
.timeline-cnt {
width: 100%;
height: auto;
margin-top: 100px;
align-items: center;
flex-direction: column;
}
.timeline-icon {
display: none;
}
.tlicomob {
margin-top: -75px;
margin-bottom: 25px;
}
.tlicomob img {
width: 100px;
}
}
#willkommen {
margin-bottom: 40px;
}
#willkommen p {
    font-size: 16px;
    line-height: 1.55;
    font-weight: 300;
}
#main .content b,
#main .content strong {
  font-family: "Lato Bold", sans-serif;
  font-weight: bold;
}

.about-section {
  background-color: #e1eafa;
  padding: 20px 40px;
}