:root {
  --font-dmSansB: dmSansB;
  --font-dmSansSB: dmSansSB;
  --font-dmSansL: dmSansL;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-dark: #333333;
  --color-titanium-white: #e3e3e341;
  --primary: #1c2026;
  --box-shadow: 0 0.25rem 0.375rem rgba(0, 0, 0, 0.1),
    0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.08); }

@font-face {
  font-family: dmSansB;
  src: url(../fonts/DMSans-Black.woff2) format(woff2);
  font-display: swap; }

@font-face {
  font-family: dmSansSB;
  src: url(../fonts/DMSans-SemiBold.woff2) format(woff2);
  font-display: swap; }

@font-face {
  font-family: dmSansL;
  src: url(../fonts/DMSans-Light.woff2) format(woff2);
  font-display: swap; }

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

body,
html {
  font-size: 16px;
  scroll-behavior: smooth;
  scroll-padding-top: 4rem;
  font-family: var(--font-dmSansL); }
  @media (max-width: 576px) {
    body,
    html {
      font-size: 12px; } }
  @media (min-width: 576px) and (max-width: 768px) {
    body,
    html {
      font-size: 13px; } }
  @media (min-width: 768px) and (max-width: 992px) {
    body,
    html {
      font-size: 15px; } }
  body a,
  html a {
    text-decoration: none; }
  body li,
  html li {
    list-style-type: none; }



.strength {
  padding: 3rem 0; }
  .strength__content {
    text-align: center; }
    .strength__content .icon {
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 auto 1.5rem;
      border-radius: 50%;
      border: 0.4rem solid var(--primary);
      width: 9rem;
      height: 9rem; }
      .strength__content .icon svg {
        width: 4.5rem; }
    .strength__content h4 {
      font-size: 1.5rem;
      font-family: var(--font-dmSansB);
      color: var(--color-black);
      margin: 0 0 1rem 0;
      text-transform: capitalize; }
    .strength__content p {
      font-size: 1rem;
      max-width: 22.5rem;
      margin: 0 auto;
      line-height: 1.5;
      color: var(--color-gray); }
      .strength__content p::first-letter {
        text-transform: capitalize; }

main .who--bg {
  background: var(--color-titanium-white);
  padding: 4rem 0; }

main .who .row {
  align-items: center; }

main .who h5 {
  font-size: 1.1rem;
  font-family: var(--font-dmSansSB);
  color: var(--primary);
  margin: 0.5rem 0 0.3125rem 0; }
  main .who h5::first-letter {
    text-transform: capitalize; }

main .who h2 {
  font-size: 2.25rem;
  font-family: var(--font-dmSansB);
  color: var(--color-black);
  margin: 0 0 0.9375rem 0;
  text-transform: capitalize; }

main .who .desc {
  font-size: 1.125rem;
  color: var(--color-dark);
  margin: 0 0 1.5rem 0;
  line-height: 1.75; }
  main .who .desc::first-letter {
    text-transform: capitalize; }

main .who ul li {
  display: flex;
  align-items: center;
  margin: 0 0 1rem 0; }
  main .who ul li p {
    font-size: 1.25rem;
    color: var(--color-dark);
    margin: 0 0 0 0.625rem;
    line-height: 1.5;
    text-transform: capitalize; }
  main .who ul li .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--primary);
    width: 1.5625rem;
    height: 1.5625rem;
    border-radius: 50%; }
    main .who ul li .icon svg {
      width: 0.7813rem;
      fill: var(--color-white); }
  main .who ul li:nth-child(6) {
    margin: 0 0 1.875rem 0; }

main .who img {
  width: 100%;
  box-shadow: 1em 1em #1c20261d;
  border-radius: 0.5em; }

main .services {
  padding: 4rem 0 2rem 0; }
  main .services h2 {
    font-size: 2rem;
    font-family: var(--font-dmSansB);
    color: var(--primary);
    text-transform: uppercase;
    line-height: 1; }
  main .services p {
    font-size: 1.25rem;
    color: #00000092;
    line-height: 1.2; }
    main .services p::first-letter {
      text-transform: capitalize; }
  main .services .components-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: 1.5rem;
    margin-top: 3rem; }
  main .services .card {
    padding: 0.75rem;
    border-left: 0.15rem solid var(--primary);
    border-radius: 0 1rem 1rem 0;
    background: rgba(0, 0, 0, 0.025);
    backdrop-filter: blur(0.75rem);
    box-shadow: var(--box-shadow); }
    main .services .card svg {
      width: 4.6875rem;
      margin: 0 0 0.625rem 0; }
    main .services .card h2 {
      font-size: 1.4rem;
      font-family: var(--font-dmSansSB);
      color: var(--color-black);
      text-transform: capitalize;
      line-height: 1.3; }
    main .services .card p {
      font-size: 1.2rem;
      color: var(--color-dark);
      line-height: 1.5; }
      main .services .card p::first-letter {
        text-transform: capitalize; }

main .world-wide {
  padding: 5rem 0 0 0; }
  main .world-wide figure {
    margin: 0;
    background: linear-gradient(to bottom, #12172c, #12172c51 60%, #12172c), url(../img/ship.png) center/cover fixed;
    padding: 6rem 0; }
    main .world-wide figure .bg {
      background: rgba(0, 0, 0, 0.25);
      backdrop-filter: blur(0.75rem);
      padding: 2rem;
      border-radius: 0.25rem; }
      @media (max-width: 768px) {
        main .world-wide figure .bg {
          padding: 1rem; } }
      main .world-wide figure .bg h5 {
        font-size: 1.1rem;
        font-family: var(--font-dmSansSB);
        text-transform: uppercase;
        color: var(--primary); }
      main .world-wide figure .bg h2 {
        font-size: 1.5rem;
        color: #fff;
        line-height: 1.2;
        margin: 0 0 0.5rem 0;
        letter-spacing: 0.5px; }
      main .world-wide figure .bg p {
        font-size: 1.25rem;
        color: #eee;
        line-height: 1.5;
        margin: 0 0 1rem 0; }
        main .world-wide figure .bg p::first-letter {
          text-transform: capitalize; }
  main .world-wide svg {
    width: 100%;
    height: 2rem;
    fill: #12172c; }
    main .world-wide svg.top {
      transform: translateY(5px); }
    main .world-wide svg.bottom {
      transform: scaleX(-1) scaleY(-1); }

main .steps__title {
  font-size: 2.8rem;
  font-family: var(--font-dmSansB);
  text-align: center;
  color: var(--color-black);
  line-height: 1.3;
  margin: 0 0 1rem 0; }
  main .steps__title::first-letter {
    text-transform: capitalize; }

main .steps--bg {
  background: var(--color-titanium-white);
  padding: 4rem 0; }
  main .steps--bg .row {
    justify-content: center; }
  main .steps--bg .card {
    background: var(--color-white);
    border-radius: 3.125rem 0.1875rem 3.125rem 0.1875rem;
    box-shadow: var(--box-shadow);
    padding: 2.5rem;
    position: relative;
    z-index: 2; }
    main .steps--bg .card h2 {
      position: absolute;
      right: -0.5rem;
      top: -2rem;
      z-index: -1;
      font-size: 8rem;
      font-family: var(--font-dmSansB);
      line-height: 1;
      margin-right: auto;
      color: var(--primary);
      text-transform: capitalize;
      margin: 0 0 1rem 0; }
    main .steps--bg .card h3 {
      font-size: 1.5rem;
      font-family: var(--font-dmSansB);
      color: var(--color-dark);
      margin: 0 0 1rem 0;
      line-height: 1.7;
      text-transform: capitalize; }
    main .steps--bg .card p {
      font-size: 1.2rem;
      color: var(--color-dark);
      line-height: 1.7; }
      main .steps--bg .card p::first-letter {
        text-transform: capitalize; }

@keyframes moveUpAndDown {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(-20px); }
  100% {
    transform: translateY(0); } }
    main .steps--bg .card:hover h2 {
      animation: moveUpAndDown 1s infinite; }

main .business {
  padding: 3rem 0; }
  main .business .row {
    justify-content: center;
    gap: 1.5rem 0; }
  main .business--title h5 {
    font-size: 1.1rem;
    font-family: var(--font-dmSansSB);
    color: var(--primary);
    margin: 0 0 0.5rem 0; }
    main .business--title h5::first-letter {
      text-transform: capitalize; }
  main .business--title h2 {
    font-size: 2.5rem;
    font-family: var(--font-dmSansB);
    color: var(--color-black);
    text-transform: capitalize; }
    main .business--title h2 span {
      color: var(--primary); }
  main .business .card .layer {
    background: #1c2026ce;
    text-align: center;
    border-radius: 1.5625rem;
    transition: all 0.5s;
    overflow: hidden; }
    main .business .card .layer:hover {
      background: #1c202687; }
    main .business .card .layer .content {
      padding: 2.1875rem;
      height: 22.8125rem;
      backdrop-filter: blur(5px);
      -webkit-backdrop-filter: blur(5px);
      border: 1px solid rgba(255, 255, 255, 0.3);
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center; }
      main .business .card .layer .content h5 {
        font-size: 1.5rem;
        font-family: var(--font-dmSansB);
        color: var(--color-white);
        text-transform: capitalize;
        margin: 0 0 0.9375rem 0; }
      main .business .card .layer .content p {
        font-size: 1.125rem;
        color: var(--color-white);
        line-height: 1.7; }
        main .business .card .layer .content p::first-letter {
          text-transform: capitalize; }
      main .business .card .layer .content svg {
        width: 10rem;
        margin: 0 auto 1.875rem; }
  main .business .card .figure1 {
    background: url(../img/business-1.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 1.5625rem;
    box-shadow: var(--box-shadow); }
  main .business .card .figure2 {
    background: url(../img/business-2.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 1.5625rem;
    box-shadow: var(--box-shadow); }
  main .business .card .figure3 {
    background: url(../img/business-3.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 1.5625rem;
    box-shadow: var(--box-shadow); }
  main .business .card .figure4 {
    background: url(../img/business-4.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 1.5625rem;
    box-shadow: var(--box-shadow); }
  main .business .card .figure5 {
    background: url(../img/business-5.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 1.5625rem;
    box-shadow: var(--box-shadow); }
  main .business .card .figure6 {
    background: url(../img/business-6.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 1.5625rem;
    box-shadow: var(--box-shadow); }


    /* flatsome */

.icon >.icon-inner >img{
    display: inline-block;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
    width: 70px;
    margin: 0 auto 1em;
}
.icon-box >div{
  margin-left: auto;
  margin-right: auto;
}

.cole{
  flex:1;
  padding: 30px 0;
}

@media screen and (max-width: 549px) {
  .cole{
    flex:0 0 100%
  }
}
.rows > .col > .col-inner {
  padding: 20px 20px 20px 20px;
}

.color-primary{
  text-decoration: none;
  font-weight:normal;
}
