/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {
    --primarycolor: #242a36;
    --secondarycolor: #0040ff;
    --highlightcolor: #668330;
    --finalcolor: #45caff;
    --additionalcolor: #79b8e2;
    --fontcolor: #333;
    --anothercolor: #7ebbd5;
}

h2 {
    font-weight: 500;
    line-height: 1.1;
    font-size: calc(22px + 0.4vw);
}

h3 {
    margin-bottom: 0;
}

h5 {
    line-height: 1.15;
}

a:hover {
    color: inherit;
}

@media (min-width: 1540px) {
    p {
        font-size: 1.2rem;
        padding: 0.6rem 0;
        line-height: 1.4;
        font-weight: 300;
        margin-bottom: 0;
    }
}

@media (min-width: 1400px) and (max-width: 1539px) {
    p {
        font-size: 1.15rem;
        padding: 0.5rem 0;
        line-height: 1.3;
        font-weight: 300;
        margin-bottom: 0;
    }
}

@media (min-width: 1200px) and (max-width: 1399px) {
    p {
        font-size: 1.1rem;
        padding: 0.4rem 0;
        line-height: 1.3;
        font-weight: 300;
        margin-bottom: 0;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    p {
        font-size: 1rem;
        padding: 0.4rem 0;
        line-height: 1.2;
        font-weight: 300;
        margin-bottom: 0;
    }
}

@media (min-width: 812px) and (max-width: 991px) {
    p {
        font-size: 1rem;
        padding: 0.4rem 0;
        line-height: 1.25;
        font-weight: 300;
        margin-bottom: 0;
    }
}

@media (min-width: 768px) and (max-width: 811px) {
    p {
        font-size: 1rem;
        padding: 0.4rem 0;
        line-height: 1.25;
        font-weight: 300;
        margin-bottom: 0;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    p {
        font-size: 1rem;
        padding: 0.5rem 0;
        line-height: 1.25;
        font-weight: 300;
        margin-bottom: 0;
    }
}

@media (max-width: 575px) {
    p {
        font-size: 1rem;
        padding: 0.4rem 0;
        line-height: 1.25;
        font-weight: 300;
        margin-bottom: 0;
    }
}


body {
    font-family: "open sans", sans-serif;
    color: var(--fontcolor);
    margin-bottom: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
    text-rendering: optimizeLegibility;
    text-rendering: geometricPrecision;
}

a {
    text-decoration: none;
    color: white;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "open sans", sans-serif;
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    right: 1vw;
    bottom: 1vw;
    z-index: 996;
    background: var(--highlightcolor);
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 4px;
    transition: all 0.4s;
}

.back-to-top i {
    font-size: 1.6rem;
    color: white;
    line-height: 0;
    padding: 0.5vw;
}

.back-to-top.active {
    visibility: visible;
    opacity: 1;
}


/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    overflow: hidden;
    background: var(--primarycolor);
}

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

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

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

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

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

/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
    overflow: hidden;
}

@media (min-width: 1540px) {
    section {
        padding: 4vw 8vw;
    }
}

@media (min-width: 1400px) and (max-width: 1539px) {
    section {
        padding: 5vw 8vw 4.5vw;
    }
}

@media (min-width: 1200px) and (max-width: 1399px) {

    section,
    footer {
        padding: 6vw 8vw 5vw;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {

    section,
    footer {
        padding: 6vw 7vw;
    }
}

@media (min-width: 812px) and (max-width: 991px) {

    section,
    footer {
        padding: 7vw 7vw 5vw;
    }
}

@media (min-width: 768px) and (max-width: 811px) {

    section,
    footer {
        padding: 9vw 7vw 7vw;
    }
}

@media (min-width: 576px) and (max-width: 767px) {

    section,
    footer {
        padding: 10vw 10vw 8vw;
    }
}

@media (max-width: 575px) {

    section,
    footer {
        padding: 15vw 11vw 12vw;
    }
}

  /*--------------------------------------------------------------
  # Header
  --------------------------------------------------------------*/

  #header {
    transition: all ease 0.7s;
    background-color: white;
  }

  #header .logo {
    background: url("../img/3-WEST-Advisory-color-logo.webp") no-repeat; 
  }

  #header .logowhite {
    background: url("../img/3-WEST-Advisory-white-logo.webp") no-repeat; 
  }

  #header .logo,
  #header .logowhite {
    transition: all ease 0.7s;
    padding: 0;
    background-size: contain !important;
    background-position: left center;
  }

  #header.header-scrolled,
  #header.header-inner-pages {
    background: var(--primarycolor);
    transition: all ease 0.7s;
    border-bottom: 0.5px solid var(--fontcolor);
  }

  #header.header-scrolled .getstarted {
    color: white !important;
    background-color: var(--highlightcolor);
  }

  #header.header-scrolled .mobile-nav-toggle {
    color: white;
  }

  @media (min-width: 1540px) {
    #header {
      padding: 2vh 6vw;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: 0.3rem 7rem;
    }

    #header .logo, .logowhite{
      height: 3.5rem;
      width: 93%;
    }

    #header.header-scrolled .navbar a {
      color: white !important;
    }
  }

  @media (min-width: 1400px) and (max-width: 1539px) {
    #header {
      padding: 1rem 4rem;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: 0.3rem 4rem;
    }

    #header .logo, .logowhite{
      height: 3.3rem;
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: white !important;
  }
  }

  @media (min-width: 1200px) and (max-width: 1399px) {
    #header {
      padding: 0.9rem 4rem;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: 0.4rem 4rem;
    }

    #header .logo, .logowhite{
      height: 3.4rem;
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: white !important;
  }
  }

  @media (min-width: 992px) and (max-width: 1199px) {  
    #header {
      padding: 0.9rem 3rem;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: 0.7rem 2.5rem;
    }

    #header .logo, .logowhite{
      height: 3.3rem;
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: white !important;
  }
  }

  @media (min-width: 812px) and (max-width: 991px) and (min-height: 992px){  
    #header {
      padding: 1.6vh 6vw;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: calc(4px + 0.7vh) 2.2rem;
    }
    
    #header .logo, .logowhite{
      height: calc(30px + 2.4vh);
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: rgb(173, 173, 173);
  }
  }

  @media (min-width: 812px) and (max-width: 991px) and (max-height: 991px){  
    #header {
      padding: 2.5vh 3vw;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: calc(4px + 0.7vh) 2.2rem;
    }
    
    #header .logo, .logowhite{
      height: calc(36px + 2.4vh);
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: rgb(173, 173, 173);
  }
  }

  @media (min-width: 768px) and (max-width: 811px) {  
    #header {
      padding: 1.6vw 6vw;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: 1vw 5.6vw;
    }

    #header .logo, .logowhite{
      height: 3.5rem;
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: rgb(173, 173, 173);
  }
  }

  @media (min-width: 576px) and (max-width: 767px) {  
    #header {
      padding: 1.3vw 3.3vw;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: 0.4vw 3.3vw;
    }

    #header .logo, .logowhite{
      height: 2.7rem;
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: rgb(173, 173, 173);
  }
  }

  @media (max-width: 575px) {  
    #header {
      padding: 0.8rem 0.7rem;
    }

    #header.header-scrolled,
    #header.header-inner-pages {
      padding: 0.3rem 0.6rem;
    }

    #header .logo, .logowhite{
      height: 3rem;
      width: 93%;
    }
    
  #header.header-scrolled .navbar a {
    color: rgb(173, 173, 173);
  }
  }

  /*--------------------------------------------------------------
  # Navigation Menu
  --------------------------------------------------------------*/
  /**
  * Desktop Navigation 
  */
  .navbar {
    padding: 0;
  }
  
  .navbar a {
    cursor: pointer;
  }
  
  .navbar ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
  }
  
  .navbar li {
    position: relative;
  }
  
  .navbar-mobile {
    color: white;
  }
  
  .navbar-mobile {
    height: 100%;
    width: 100%;
  }
  
  .navbar-mobile .mobile-nav-toggle {
    position: absolute;
  }
  
  .navbar-mobile li {
    animation: fadeIn cubic-bezier(.50,.00,.50,1) .5s forwards;
    opacity: 0;
  }
  
  .navbar-mobile li:nth-child(1) {animation-delay: .050s;}
  .navbar-mobile li:nth-child(2) {animation-delay: .100s;}
  .navbar-mobile li:nth-child(3) {animation-delay: .150s;}
  .navbar-mobile li:nth-child(4) {animation-delay: .200s;}
  .navbar-mobile li:nth-child(5) {animation-delay: .250s;}
  .navbar-mobile li:nth-child(6) {animation-delay: .300s;}
  .navbar-mobile li:nth-child(7) {animation-delay: .350s;}
  
  .navbar-mobile li:nth-child(5) {margin-top: 4vh;}
  
  @keyframes fadeIn {
    0% { 
      opacity: 0; 
      transform: translateX(60%);
    }
  
    90% { 
      opacity: .3; 
    }
  
    100% { 
      opacity: 1; 
      transform: translateX(0%);
    }
  }
  
  @media (min-width: 1540px) {
  
    .navbar>ul>li {
      white-space: nowrap;
      padding: 0.5vw 0 0.5vw 4vw;
    }
  
    .navbar .getstarted,
    .navbar .getstarted:focus {
      display: inline-block;
      padding: 0.6rem 1.8rem;
      font-size: 16px;
      border-radius: 5px;
      background: var(--highlightcolor);
      color: white !important;
      transition: 0.3s;
      text-align: center;
    }
  
    .navbar a,
    .navbar a:focus {
      font-size: 1.1rem;
    }
  }
  
  @media (min-width: 1400px) and (max-width: 1539px) {
    .navbar>ul>li {
      white-space: nowrap;
      padding: 0.5vw 0 0.5vw 4.2vw;
    }
  
    .navbar .getstarted,
    .navbar .getstarted:focus {
      padding: 0.6rem 1.8rem;
      font-size: 16px;
      margin-left: 2rem;
      border-radius: 4px;
      color: white !important;
      background-color: var(--highlightcolor);
      border: none;
    }
  
    .navbar a,
    .navbar a:focus {
      font-size: 1rem;
    }
  }
  
  @media (min-width:992px) and (max-width: 1399px) {
    .navbar>ul>li {
      padding: 0.5rem 0.2rem 0.5rem 4.3vw;
    }
  
    .navbar .getstarted,
    .navbar .getstarted:focus {
      padding: 0.5rem 1.5rem;
      font-size: 15px;
      margin-left: 0.7rem;
      border-radius: 4px;
      color: white !important;
      background-color: var(--highlightcolor);
      border: none;
    }  
  
    .navbar a,
    .navbar a:focus {
    font-size: 1rem;
    }
  }
  
  @media (min-width:576px) and (max-width: 991px) {
    .navbar>ul>li {
      text-align: center;
    }
  
    .navbar-mobile {
      height: 100%;
      width: 100%;
    }
  
    .navbar a,
    .navbar a:focus {
      display: inline-block !important;
    }
  
    .mobile-nav-toggle {
      color: var(--primarycolor);
      font-size: calc(36px + 1vh);
      font-weight: 900;
    }
  
    .navbar .getstarted,
    .navbar .getstarted:focus {
      padding: 0.4rem 1.2rem;
      font-size: 16px;
      margin-left: 1.2rem;
    }  
  }
  
  @media (min-width:576px) and (max-width: 991px) and (min-height: 677px){
  
    .navbar-mobile ul {
      top: 6rem !important;
      left: 3.9rem !important;
    }
  
    .space{
      padding: 20px 0;
      font-weight: 20px !important;
    }
  
    .dropdown-active .space {
      padding: 0;
    }
  
    .navbar .getstarted,
    .navbar .getstarted:focus {
      margin-top: 3rem;
      padding: 0.5rem 1.5rem;
    }
  }
  
  @media (min-width:576px) and (max-width: 991px) and (max-height: 676px){
  
    .navbar-mobile ul {
      top: 5rem !important;
      left: 3.9rem !important;
    }
  
    .space{
      padding: 14px 0;
      font-weight: 18px !important;
    }
  
    .dropdown-active .space {
      padding: 0;
    }
  
    .navbar .getstarted,
    .navbar .getstarted:focus {
      margin-top: 2.8rem;
      padding: 0.4rem 1.2rem;
      margin-left: 0 !important;
    }
  } 
  
  @media (max-width:575px){
  
  .mobile-nav-toggle {
      top: 4.2%;
      color: var(--primarycolor);
      font-size: 2.1rem;
      font-weight: 900;
    }
  
    .navbar-mobile ul {
      top: 5rem !important;
    }
  
    .space{
      padding: 20px 0;
      font-weight: 18px !important;
    }
  
    .dropdown-active .space {
      padding: 0;
    }
  
    .navbar .getstarted,
    .navbar .getstarted:focus {
      padding: 0.4rem 1.2rem;
      width: fit-content;
      margin-top: 2.8rem;
      margin-left: 0 !important;
    }
  }
  
  @media (max-width: 575px) {  
  
      .navbar>ul>li {
      text-align: center;
    }
  
    .navbar-mobile {
      height: 100%;
      width: 100%;
    }
  }
  
@media (min-width:768px) and (max-width: 991px) and (min-height: 677px) {
    .fa-xmark-large {
    position: relative;
    left: -4px;
  }
}  

@media (min-width:768px) and (max-width: 991px) and (max-height: 676px) {
    .fa-xmark-large {
    position: relative;
    left: -10px;
  }
}  
@media (min-width: 576px) and (max-width: 767px) {  
    .fa-xmark-large {
    position: relative;
    left: -4px;
  }
}  
@media (max-width: 575px) {
    .fa-xmark-large {
    position: relative;
    left: 0px;
  }
}  

  .navbar a,
  .navbar a:focus {
    align-items: center;
    position: relative;
    justify-content: space-between;
    font-weight: 400;
    color: var(--primarycolor) !important;
    white-space: nowrap;
    transition: 0.3s;
  }
  
  .navbar a i,
  .navbar a:focus i {
    font-size: 0.75rem;
    line-height: 0;
    margin-left: 0.33rem;
  }
  
  .navbar>ul>li>a:before {
    content: "";
    position: absolute;
    height: 0.2rem;
    bottom: -0.4rem;
    left: 0;
    visibility: hidden;
    width: 0;
    transition: all 0.3s ease-in-out 0s;
  }
  
  .navbar a:hover:before,
  .navbar li:hover>a:before,
  .navbar .active:before {
    visibility: visible;
  }
  
  .navbar a:hover {
    color: var(--primarycolor);
  }
  
  .navbar-mobile a:hover {
    color: white;
  }
  
  .navbar .getstarted:hover,
  .navbar .getstarted:focus:hover {
    color: white;
  }
  
  .navbar>ul>li>.getstarted:before {
    visibility: hidden;
  }
  
  .navbar .dropdown ul {
    display: block;
    position: absolute;
    left: 0;
    top: calc(100% + 30px);
    margin: 0;
    padding: 0.25rem;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    background: var(--primarycolor);
    transition: 0.3s;
    border-radius: 8px;
    border: 1px solid rgb(137, 137, 137);
  }
  
  .navbar .dropdown ul li {
    min-width: 12.5rem;
  }
  
  .navbar .dropdown ul a {
    padding: 0.7rem 1.25rem;
    font-size: 0.9rem;
    text-transform: none;
    color: white !important;
    font-weight: 400;
  }
  
  .navbar .dropdown ul :hover{
    color: white;
    cursor: pointer;
  }
  
  .navbar .dropdown ul a i {
    font-size: 0.75rem;
  }
  
  .navbar .dropdown:hover>ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }
  
  .navbar .dropdown .dropdown ul {
    top: 0;
    left: calc(100% - 30px);
  }
  
  .navbar .dropdown .dropdown:hover>ul {
    opacity: 1;
    top: 0;
    left: 100%;
    visibility: visible;
  }
  
  @media (max-width: 1400px) {
  
    .navbar .dropdown .dropdown ul {
      left: 90%;
    }
  
    .navbar .dropdown .dropdown:hover>ul {
      left: 100%;
    }
  }
  
  /**
  * Mobile Navigation 
  */
  
  .fa-xmark-large {
    color: white;
  }
  
  .mobile-nav-toggle {
    cursor: pointer;
    display: none;
    line-height: 0;
    transition: 0.5s;
    position: relative;
  }
  
  @media (max-width: 991px) {
    .mobile-nav-toggle {
      display: block;
      z-index: 999;
    }
  
    .navbar ul {
      display: none;
    }
  
  }
  
  .navbar-mobile {
    position: fixed;
    overflow: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    background: var(--primarycolor);
    z-index: 998;
    animation: fadeInDown 0.3s;
  }
  
  .navbar-mobile ul {
    text-align: center;
    display: block;
    position: absolute;
    top: 4rem;
    right: 0.9rem;
    bottom: 0.9rem;
    left: 0.9rem !important;
    padding: 0.7rem 0.9rem 0.7rem 0;
    background-color: var(--primarycolor);
    overflow-y: auto;
  }
  
  .navbar-mobile a,
  .navbar-mobile a:focus {
    color: white !important;
  }
  
  .navbar-mobile a:hover .dropdown-active,
  .navbar-mobile .active .dropdown-active,
  .navbar-mobile li:hover>a .dropdown-active{
    display: block;
  }
  
  .navbar-mobile .getstarted,
  .navbar-mobile .getstarted:focus {
    color: white;
    background: var(--highlightcolor);
    border-radius: 6px;
    margin-left: 0 !important;
  }
  
  .navbar-mobile .dropdown ul {
    position: static;
    display: none;
    margin: 0 0 1rem 0;
    z-index: 99;
    opacity: 1;
    visibility: visible;
    border: none;
    color: gray;
  }
  
  .navbar-mobile .dropdown ul li {
    min-width: 12.5rem;
  }
  
  .navbar-mobile .dropdown ul a {
    padding: 0.6rem 0 0.4rem;
    color: rgb(173, 173, 173) !important;
  }
  
  .navbar-mobile .dropdown ul a i {
    font-size: 0.75rem;
  }
  
  .navbar-mobile .dropdown>.dropdown-active {
    display: block;
    overflow: hidden;
  }
  
  @-webkit-keyframes animate-loading {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(360deg);
    }
  }
  
  @keyframes animate-loading {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(360deg);
    }
  }
  
/*--------------------------------------------------------------
# Titles
--------------------------------------------------------------*/

.titleline {
  padding-bottom: calc(28px + 2.4vw);
}

.titleline h2 {
  display: block !important;
  text-align: center;
  font-weight: 500;
  font-size: calc(24px + 0.4vw);
  position: relative;
  /* Ensures the pseudo-element is positioned in relation to the .h2 element */
}

.titleline h2::after {
  content: '';
  /* Required for pseudo-elements */
  position: absolute;
  bottom: calc(-20px - 0.5vw);
  /* Adjusts the vertical position of the border relative to the bottom of the .h2 element */
  left: 46%;
  /* Starting point of the border from the left */
  width: 8%;
  /* Makes the border span from 25% to 75% across */
  height: 2.5px;
  /* Thickness of the border */
}

/*--------------------------------------------------------------
# cover
--------------------------------------------------------------*/
.cover {
    background-color: var(--primarycolor);
    color: white;
    padding: 0;
    width: 100%;
}

.cover p {
    padding: 1vw 0;
    line-height: 1.4;
    font-weight: 300;
    margin-bottom: 0;
}

.cover .mypic1 {
    position: relative;
    /* Add this line */
    background-image: url(../img/cash-flow-management.webp);
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 80%;
}

.cover .mypic1::after {
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    /* Set to 100% to cover the full area, clip-path will create the triangle shape */
    background-color: var(--primarycolor);
    opacity: 1;
    /* Create a triangle shape */
    clip-path: polygon(25% 0, 0 50%, 25% 101%, -4% 101%, -4% 0);

}

.cover .mypic2 {
    position: relative;
    /* Add this line */
    background-image: url(../img/Valuation&Strategy.webp);
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 60%;
}

.cover .mypic2::after {
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    /* Set to 100% to cover the full area, clip-path will create the triangle shape */
    background-color: var(--primarycolor);
    opacity: 1;
    /* Create a triangle shape */
    clip-path: polygon(25% 0, 0 50%, 25% 101%, 0 101%, 0 0);
}

.cover .mypic3 {
    position: relative;
    /* Add this line */
    background-image: url(../img/financing.jpg);
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 80%;
}

.cover .mypic3::after {
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    /* Set to 100% to cover the full area, clip-path will create the triangle shape */
    background-color: var(--primarycolor);
    opacity: 1;
    /* Create a triangle shape */
    clip-path: polygon(25% 0, 0 50%, 25% 100%, 0 100%, 0 0);
}

.cover .mypic4 {
    position: relative;
    /* Add this line */
    background-image: url(../img/3-WEST-Advisory-transfer-pricing.jpg);
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom 50%;
}

.cover .mypic4::after {
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    /* Set to 100% to cover the full area, clip-path will create the triangle shape */
    background-color: var(--primarycolor);
    opacity: 1;
    /* Create a triangle shape */
    clip-path: polygon(25% 0, 0 50%, 25% 100%, 0 100%, 0 0);
}

.cover .mypic5 {
    position: relative;
    /* Add this line */
    background-image: url(../img/investor-relations.webp);
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}

.cover .mypic5::after {
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    /* Set to 100% to cover the full area, clip-path will create the triangle shape */
    background-color: var(--primarycolor);
    opacity: 1;
    /* Create a triangle shape */
    clip-path: polygon(25% 0, 0 50%, 25% 101%, 0 101%, 0 0);
}

.cover .short {
    display: flex;
}


@media (min-width: 1540px) {
  .cover p {
      font-size: calc(14px + 0.4vw);
  }

  .cover .mypic {
      background-position: 80% 52%;
      background-size: cover;
      height: 17vw;
  }

  .cover .mypic:after {
      position: absolute;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
  }
  
  h1 {
      font-size: 2.5rem;
      padding: 10px 0 1vw;
  }
}

@media (min-width: 1400px) and (max-width: 1539px) {
  .cover .mypic {
      background-position: 10% 40%;
      background-size: cover;
      height: 23vw;
  }

  .cover .mypic:after {
      position: absolute;
  }

  .cover p {
      font-size: 1.3rem;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
  }
  
  h1 {
      font-size: 2.5rem;
      padding: 10px 0 1vw;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .cover .mypic {
      background-position: center center;
      background-size: cover;
      height: 27vw;
  }

  .cover .mypic:after {
      position: absolute;
  }

  .cover p {
      font-size: 1.3rem;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
  }
  
  h1 {
      font-size: 2.4rem;
      padding: 10px 0 1vw;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .cover .mypic {
      background-position: center bottom;
      background-size: cover;
      height: 27vw;
  }

  .cover .mypic:after {
      position: absolute;
  }

  .cover p {
      font-size: 1.3rem;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
  }
    
  h1 {
      font-size: 2.2rem;
      padding: 10px 0 1vw;
  }
}

@media (min-width: 812px) and (max-width: 991px) {
  .cover .mypic {
      background-position: center;
      background-size: cover;
      height: calc(273px + 2vh);
  }

  .cover .mypic:after {
      position: absolute;
  }

  .cover p {
      font-size: 1.2rem;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
  }
    
  h1 {
      font-size: 1.8rem;
      padding: 10px 0 1vw;
  }
}

@media (min-width: 768px) and (max-width: 811px) {
  .cover .mypic {
      background-position: left bottom;
      background-size: cover;
      height: calc(220px + 8vh);
  }

  .cover .mypic:after {
      position: absolute;
  }

  .cover p {
      font-size: 1.2rem;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
  }
    
  h1 {
      font-size: 1.7rem;
      padding: 10px 0 1vw;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .cover .mypic {
      background-position: center;
      background-size: cover;
      height: 48vw;
      justify-content: center;
      order: 2;
      margin: 0 auto 16vh auto;
  }

  .cover .short {
      order: 1;
      text-align: center;
      height: 24vw;
  }

  .cover p {
      font-size: 1.2rem;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
      margin: 3vh auto;
  }
    
  h1 {
      font-size: 1.8rem;
      padding: 10px 0 1vw;
  }
}

@media (max-width: 575px) {
  .cover .mypic {
      background-position: center;
      background-size: cover;
      min-height: 57vw;
      order: 2;
      margin: 0 auto 8vh auto;
  }

  .cover .short {
      order: 1;
      text-align: center;
      margin: 6vh auto 5vh;
      height: 38vw;
  }

  .cover p {
      font-size: 1.2rem;
  }

  .cover .short {
      flex-direction: column;
      justify-content: center;
  }
    
  h1 {
      font-size: 1.8rem;
      padding: 10px 0 1vw;
  }
}

/*--------------------------------------------------------------
# outcomes
--------------------------------------------------------------*/

.outcomes {
  background-color: white;
  color: var(--primarycolor);
}

.outcomes p {
  padding-top: 12px;
}

.outcomes .titleline h2::after {
  background-color: var(--primarycolor);
  /* Color of the border, change as needed */
}

.outcomes, .benefits h3 {
    font-weight: 700;
}

.circle {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  padding: 0.4rem;
  box-sizing: border-box;
  background-color: var(--additionalcolor);
  margin-bottom: 1.25vw;
}

.circle i {
  line-height: 1;
  margin: auto;
  color: var(--primarycolor);
}

@media (min-width: 1540px) {
  .outcomes {
      text-align: left;
  }

  .outcomes, .benefits h3 {
      font-size: 1.45rem;
  }

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .top {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: calc(12px + 1.2vw) calc(12px + 1.1vw);
  }

  .across {
    justify-content: space-evenly;
  }

  .circle {
    height: 7vw;
    width: 7vw;
  }

  .circle {
    font-size: 3.7vw;
  }
}

@media (min-width: 1400px) and (max-width: 1539px) {
  .outcomes {
      text-align: left;
      padding-bottom: 3vw !important;
  }
    
  .outcomes, .benefits h3 {
      font-size: 1.45rem;
  }

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .circle {
    height: 7vw;
    width: 7vw;
  }

  .circle {
    font-size: 4vw;
  }

  .top {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: calc(12px + 1.2vw) calc(12px + 1.1vw);
  }

  .across {
    justify-content: space-evenly;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .outcomes {
      text-align: left;
      padding-bottom: 3vw !important;
  }
    
  .outcomes, .benefits h3 {
      font-size: 1.45rem;
  }

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .circle {
    height: 7vw;
    width: 7vw;
  }

  .circle {
    font-size: 3.75vw;
  }

  .top {
    display: flex;
    flex-direction: column;
   justify-content: start;
    padding: calc(12px + 1.2vw) calc(12px + 1.1vw);
  }

  .across {
    justify-content: space-evenly;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .outcomes {
      text-align: left;
      padding-bottom: 4vw;
  }

  .outcomes, .benefits h3 {
      font-size: 1.45rem;
  }  

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .circle {
    height: 8.3vw;
    width: 8.3vw;
  }

  .circle {
    font-size: 4.55vw;
  }

  .top {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: calc(12px + 1.2vw) 0;
  }

  .across {
    justify-content: space-evenly;
  }
}

@media (min-width: 812px) and (max-width: 991px) {
  .outcomes {
    text-align: left;
  }

  .outcomes, .benefits h3 {
      font-size: 1.4rem;
  }  

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .circle {
    height: 10.5vw;
    width: 10.5vw;
  }

  .circle {
    font-size: 6vw;
    margin-bottom: 2vw !important;
  }

  .circle {
    text-align: left;
    align-self: top;
  }

  .top {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: 16px 34px;
  }

  .across {
    justify-content: space-evenly;
  }

}

@media (min-width: 768px) and (max-width: 811px) {
  .outcomes {
      text-align: left;
  }

  .outcomes, .benefits h3 {
      font-size: 1.4rem;
  }  

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .circle {
    height: 14vw;
    width: 14vw;
  }

  .circle {
    font-size: 7vw;
    margin-bottom: 3vw !important;
  }

  .circle {
    text-align: left;
    align-self: top;
  }

  .top {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: calc(12px + 1.2vw) calc(16px + 1vw);
  }

  .across {
    justify-content: space-between;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .outcomes {
      text-align: left;
  }
    
  .outcomes, .benefits h3 {
      font-size: 1.4rem;
  }

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .circle {
    height: 16vw;
    width: 16vw;
  }

  .circle {
    font-size: 9.5vw;
    margin-bottom: 2.5vw !important;
  }

  .circle {
    text-align: left;
    align-self: top;
  }

  .top {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: calc(22px + 1.2vw) calc(12px + 1.1vw);
  }
}

@media (max-width: 575px) {
  .outcomes {
    text-align: left;
  }

  .outcomes, .benefits h3 {
      font-size: 1.4rem;
  }

  .outcomes, .benefits p {
    font-size: 1.15rem;
  }

  .circle {
    height: 21vw;
    width: 21vw;
  }

  .circle {
    font-size: 12.4vw;
    margin-bottom: 3vw !important;
  }

  .top {
    align-items: top;
    margin: 1vh 0 0;
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: calc(12px + 1.2vw) calc(12px + 1.1vw);
  }

}

/*--------------------------------------------------------------
# specific
--------------------------------------------------------------*/

.specific {
  background-color: var(--primarycolor);
  color: white;
}

.specific .titleline h2::after {
  background-color: white;
  /* Color of the border, change as needed */
}

.benefits {
  display: flex;
  justify-content: space-evenly;
}

.benefits p {
  padding-top: 12px;
}

.benefits h3 {
    font-weight: 700;
}

.benefits p {
  padding: 0.6rem 0;
  line-height: 1.3;
  font-weight: 200;
  margin-bottom: 0;
  color: rgb(173, 173, 173);
}

.benefits i {
    font-size: calc(40px + 0.9vw);
    padding: 0.2rem 0;
    margin-bottom: 0;
    color: var(--finalcolor);
    text-align: right !important;
    margin-bottom: 10px;
    font-style: normal;
}


.box {
    display: flex;
    justify-content: center;
    flex-direction: row;
    padding: calc(12px + 3vw) 2vw calc(1vw + 12px);
}


@media (min-width: 1400px) and (max-width: 1539px) {

.push {
    text-align: right;
    margin-right: calc(1.8vw + 4px);
}
}

@media (min-width: 1200px) and (max-width: 1399px)  {

.push {
    text-align: right;
    margin-right: calc(1.8vw + 4px);
}
}

@media (min-width: 992px) and (max-width: 1199px)  {

.push {
    text-align: right;
    margin-right: calc(1.8vw + 4px);
}
}

@media (min-width: 812px) and (max-width: 991px) and (max-height: 600px) {  

.push {
    text-align: right;
    margin-right: calc(1.8vw + 4px);
}
}

@media (min-width: 812px) and (max-width: 991px) and (min-height: 601px) {  

.push {
    text-align: right;
    margin-right: calc(1.8vw + 4px);
}
}

@media (min-width: 768px) and (max-width: 811px) {  
.push {
    text-align: center;
    margin-right: calc(1.8vw + 4px);
}
}

@media (min-width: 576px) and (max-width: 767px) {  

.push {
    text-align: left;
}
}

@media (max-width: 575px) {  

.push {
    text-align: left;
}
} 



/*--------------------------------------------------------------
# Engagement
--------------------------------------------------------------*/

#engagement-process .process-container {
    text-align: center;
    margin-bottom: 1vw;
    /* Center the content */
}

#engagement-process {
  background-color: white;
}

#engagement-process .titleline {
  padding-bottom: 10px;
}

#engagement-process .titleline h2::after {
  background-color: var(--primarycolor);
  /* Color of the border, change as needed */
}

.process-number {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--additionalcolor);
    border: white 6px solid;
    font-size: calc(21px + 0.5vw);
    /* Adjust font size as needed */
    font-weight: 900;
    color: var(--primarycolor);
    border-radius: 50%;
    height: calc(60px + 0.7vw);
    /* Set to desired size */
    width: calc(60px + 0.7vw);
    /* Ensure width and height are the same for a circle */
    margin: auto;
    position: relative;
}

.process-step {
    display: flex;
    flex-direction: column;
    text-align: center;
    background: rgb(230, 241, 250);
    color: var(--primarycolor);
    padding: calc(32px + 2vw) calc(8px + 0.8vw) calc(18px + 2vw);
    border-radius: 28px;
    border: 1px var(--additionalcolor) solid;
}

.process-step i{
  font-size: 60px;
  padding-bottom: 16px;
  color: var(--primarycolor);
}

.area {
    display: flex;
    flex-direction: column;
}

.process-container {
    flex: 1;
    /* Flex grow */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    /* Align content to the top */
}

.process-step {
    flex: 1;
    /* Allows the box to expand to fill the available space */
}

.process-step h2 {
    font-size: calc(19px + 0.2vw);
    /* Responsive title size */
    font-weight: 800;
}

.process-step p {
    font-size: 1.15rem;
    /* Responsive paragraph size */
    line-height: 1.2;
    font-weight: 100;
    padding: 8px 0 0 0;
}

@media (min-width: 1540px) {
  .area {
      flex: 1;
      width: 20%;
  }

  .process-number {
      top: calc(0.4vw + 25px);
      /* Adjust as needed to position above the step */
  }

  #engagement-process .process-container {
    margin-top: -40px;
  }

}

@media (min-width: 1400px) and (max-width: 1539px) {
  .area {
      flex: 1;
      width: 20%;
  }

  .process-number {
      top: calc(0.4vw + 25px);
      /* Adjust as needed to position above the step */
  }

  #engagement-process .process-container {
    margin-top: -40px;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .area {
      width: 35%;
  }

  .process-number {
      top: calc(0.4vw + 25px);
      /* Adjust as needed to position above the step */
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .area {
      width: 40%;
  }

  .process-number {
      top: calc(0.4vw + 25px);
      /* Adjust as needed to position above the step */
  }
}

@media (min-width: 812px) and (max-width: 991px) {
  .area {
      width: 45%;
  }

  .process-number {
      top: calc(0.4vw + 25px);
      /* Adjust as needed to position above the step */
  }

  #engagement-process {
    padding-bottom: 8vw;
  }
}

@media (min-width: 768px) and (max-width: 811px) {
  .area {
      width: 90%;
  }

  .process-number {
      top: calc(0.4vw + 25px);
      /* Adjust as needed to position above the step */
  }
}

@media (min-width: 576px) and (max-width: 767px) {

  .area {
      width: 90%;
  }

  .process-number {
      top: calc(0.4vw + 25px);
      /* Adjust as needed to position above the step */
  }

}

@media (max-width: 575px) {
  .area {
      width: 90%;
  }

  .process-number {
    top: calc(0.4vw + 25px);
    /* Adjust as needed to position above the step */
  }
  
}

/*--------------------------------------------------------------
# Call To Action Section
--------------------------------------------------------------*/
.call-to-action {
    background-color: var(--primarycolor);
    text-align: left;
    color: white;
}

.call-to-action h2 {
    font-weight: 500;
    margin: 0 0 calc(2px + 1.2vw) 0;
    line-height: 1.l;
}

.call-to-action .cta-btn {
    display: inline-block;
    border-radius: 5px;
    transition: 0.5s;
    margin: calc(12px + 1.2vw) 0 0 0;
    color: #fff;
    background: var(--highlightcolor);
}

.call-to-action i {
    margin-right: 0.4rem;
}

.call-to-action li {
    padding-bottom: 0.25rem;
}

.call-to-action ul {
    color: white;
    list-style: none;
    font-size: 1rem;
}

.call-to-action .cta-right {
    display: flex;
    padding: 1vw 0 0 0;
    align-items: center;
    justify-content: right !important;
}

.call-to-action .cta-left {
    padding: 0;
}

@media (min-width: 1540px) {

    .call-to-action {
        padding: 6vw calc(18vw + 12px);
    }

    .call-to-action .cta-btn {
        font-weight: 400;
        font-size: 1.1rem;
        padding: 0.5vw 1.8vw;
    }

    .call-to-action h2 {
        font-size: 2.1rem;
    }

    .call-to-action p {
        font-size: calc(15px + 0.3vw);
        line-height: 1.5;
        margin-top: 1.4vw;
        margin-bottom: 0;
        font-weight: 100;
    }

}

@media (min-width: 1400px) and (max-width: 1539px) {
    .call-to-action {
        padding: 7vw 16vw;
    }

    .call-to-action .cta-btn {
        font-weight: 400;
        font-size: 1.1rem;
        padding: 0.5vw 1.8vw;
    }

    .call-to-action h2 {
        font-size: 2rem;
    }

    .call-to-action p {
        font-size: 1.3vw;
        line-height: 1.4;
        margin-top: 1.4vw;
        margin-bottom: 0;
    }

}

@media (min-width: 1200px) and (max-width: 1399px) {

    .call-to-action {
        padding: 6vw 10vw;
    }

    .call-to-action .cta-btn {
        font-weight: 500;
        font-size: 1rem;
        padding: 0.5rem 1.6rem;
    }

    .call-to-action h2 {
        font-size: 1.8rem;
    }

    .call-to-action p {
        font-size: 1.4vw;
        line-height: 1.3;
        margin-top: 1.4vw;
        margin-bottom: 0;
    }

}

@media (min-width: 992px) and (max-width: 1199px) {

    .call-to-action {
        padding: 8vw 9vw 7vw;
    }

    .call-to-action .cta-btn {
        font-weight: 400;
        font-size: 1.1rem;
        padding: 0.5vw 2vw;
    }

    .call-to-action h2 {
        font-weight: 500;
        font-size: calc(19px + 0.6vw);
        padding-bottom: 0.4rem;
    }

    .call-to-action p {
        font-size: calc(12px + 0.5vw);
        padding-top: 0.5rem;
        line-height: 1.4;
        font-weight: 300;
        margin-bottom: 0rem;
    }


}

@media (min-width: 768px) and (max-width: 991px) {

    .call-to-action {
        padding: 10vw 10vw 9vw 10vw;
    }

    .call-to-action .cta-btn {
        font-weight: 400;
        font-size: 1rem;
        padding: 0.6vw 2.4vw;
    }

    .call-to-action h2 {
        font-weight: 500;
        font-size: calc(18px + 0.7vw);
        padding-bottom: 0;
    }

    .call-to-action p {
        font-size: 17px;
        padding-top: 0.5rem;
        line-height: 1.2;
        font-weight: 300;
        margin-bottom: 0rem;
        margin-right: 5%;
    }

    .call-to-action .cta-right {
        align-items: center !important;
    }

}

@media (min-width: 576px) and (max-width: 767px) {

    .call-to-action {
        padding: 9vw 9vw;
    }

    .call-to-action .cta-btn {
        font-weight: 400;
        font-size: 1em;
        padding: 0.9vw 3.6vw;
    }

    .call-to-action h2 {
        font-weight: 500;
        font-size: calc(20px + 0.7vw);
        padding-bottom: 0;
    }

    .call-to-action p {
        font-size: calc(10px + 1vw);
        padding-top: 0.5rem;
        line-height: 1.2;
        font-weight: 300;
        margin-bottom: 1.25rem;
        margin-right: 5%;
    }

    .call-to-action .cta-right {
        display: flex;
        padding: 4vw 0 0 0;
        justify-content: left !important;
        margin: 0;
    }

    .call-to-action .cta-left {
        padding: 0;
    }

}

@media (max-width: 576px) {

    .call-to-action {
        padding: 12vw;
    }

    .call-to-action .cta-btn {
        font-weight: 400;
        font-size: 0.9rem;
        padding: 1.5vw 6vw;
    }

    .call-to-action h2 {
        font-weight: 500;
        font-size: calc(20px + 0.5vw);
        padding-bottom: 10px;
    }

    .call-to-action p {
        font-size: calc(14px + 0.5vw);
        padding-top: 0.5rem;
        line-height: 1.2;
        font-weight: 300;
        margin-bottom: 1.25rem;
    }

    .call-to-action .cta-right {
        display: flex;
        padding: 4vw 0 0 0;
        justify-content: left !important;
        margin: 0;
    }

    .call-to-action .cta-left {
        padding: 0;
    }
}

/*--------------------------------------------------------------
# Frequently Asked Questions
--------------------------------------------------------------*/
.faq {
    background: #f7f7f7;
    color: var(--primarycolor);
}

.faq h2 {
    text-align: center;
    padding: 0 0 calc(2vw + 12px) 0;
}

.faq .faq-list {
    padding: 0;
}

.faq .faq-list ul {
    padding: 0;
    list-style: none;
}

.faq .faq-list li+li {
    margin-top: 1.1rem;
}

.faq .faq-list li {
    padding: 0.9rem 1.9rem;
    background: rgb(230, 241, 250);
    border-radius: 4px;
    position: relative;
    font-size: calc(14px + 0.1rem);
    border: 1px solid var(--additionalcolor);
}

.faq .faq-list a {
    display: block;
    position: relative;
    outline: none;
    cursor: pointer;
    color: var(--primarycolor);

}

.faq .faq-list .icon-help {
    font-size: 1.1rem;
    position: absolute;
    right: 0;
    left: 1.25rem;
    color: var(--primarycolor);
}

.faq .faq-list .icon-show,
.faq .faq-list .icon-close {
    font-size: 1.1rem;
    font-weight: 100;
    position: absolute;
    right: 0;
    top: 0;
}

.faq .faq-list p {
    margin-bottom: 0;
    padding: 1rem 0 0 0;
    color: var(--primarycolor);
    line-height: 1.2;
    font-weight: 300;
    font-size: calc(6px + 0.6rem)
}

.faq .faq-list .icon-show {
    display: none;
}

.faq .faq-list a.collapsed {
    color: var(--primarycolor);
    transition: 0.3s;
}

.faq .faq-list a.collapsed .icon-show {
    display: inline-block;
}

.faq .faq-list a.collapsed .icon-close {
    display: none;
}

@media (min-width: 1540px) {
    .faq .faq-list {
        padding: 0.5vw 0 0 0;
        display: flex;
        justify-content: space-evenly;
    }

    .faq {
        padding: 5vw 11vw;
    }

    .faq .faq-list a {
        font-size: 1.1rem;
        line-height: 1.2;
        font-weight: 100;
        padding: 0 1.9rem;
    }

}

@media (min-width: 1400px) and (max-width: 1539px) {
    .faq .faq-list {
        padding: 1.3vw 0 0 0;
        display: flex;
        justify-content: space-evenly;
    }

    .faq {
        padding: 5vw 8vw;
    }

    .faq .faq-list a {
        font-size: 1rem;
        line-height: 1.1;
        font-weight: 100;
        padding: 0 1.9rem;
    }
  }

@media (min-width: 1200px) and (max-width: 1399px) {
    .faq .faq-list {
        padding: 1vw 0 0 0;
        display: flex;
        justify-content: space-evenly;
    }

    .faq {
        padding: 6vw 6vw 7vw 6vw;
    }

    .faq .faq-list a {
        font-size: calc(14px + 0.1rem);
        line-height: 1.5rem;
        font-weight: 500;
        padding: 0 1.9rem;
    }

}

@media (min-width: 992px) and (max-width: 1199px) {
    .faq .faq-list {
        padding: 0;
        display: flex;
        justify-content: space-evenly;
    }

    .faq {
        padding: 6vw 3vw 7vw 3vw;
    }

    .faq .faq-list a {
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: 500;
        padding: 0 1.9rem;
    }

    .faq h3 {
        font-size: calc(12px + 0.7vw);
        font-weight: 100;
        letter-spacing: 0.1rem;

    }

}

@media (min-width: 768px) and (max-width: 991px) {

    .faq .faq-list {
        padding: 0;
    }

    .faq {
        padding: 8vw 10vw 9vw 10vw;
    }

    .faq .faq-list a {
        font-size: calc(14px + 0.2rem);
        line-height: 1.5rem;
        font-weight: 500;
        padding: 0 1.9rem;
    }

}

@media (min-width: 576px) and (max-width: 767px) {


    .faq .faq-list {
        padding: 0;
    }

    .faq {
        padding: 8vw 11vw;

    }

    .faq .faq-list a {
        font-size: calc(14px + 0.1rem);
        line-height: 1.5rem;
        font-weight: 500;
        padding: 0 1.9rem;
    }
}

@media (max-width: 576px) {

    .faq .faq-list {
        padding: 0;
    }

    .faq {
        padding: 10vw;

    }

    .faq .faq-list a {
        font-size: 1rem;
        line-height: 1.1rem;
        font-weight: 400;
        padding: 0 1.5rem;
    }

}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer {
  background: var(--primarycolor);
  color: white;
  height: auto;
  overflow: hidden;
}

.footer .footer-content {
  display: flex;
  padding: 1vw 0 0 0;
  justify-content: space-between;
}

.footer a {
  color: rgb(173, 173, 173);
}

.footer-newsletter {
  order: 1;
}

.footer .contact {
  margin-top: 1.5vw;
}

.footer .footer-co {
  font-size: 1.3rem !important;
  font-weight: 400 !important;
}

.footer .footer-content .social-links a {
font-size: 0.9rem;
line-height: 0;
display: inline-block;
width:  2rem;
height:  2rem;
color: var(--primarycolor);
margin-right: 0.7rem;
margin-bottom: 3rem;
margin-top: 0;
transition: 0.3s;
display: flex;
justify-content: center;
align-items: center;
background-color: white;
border-radius: 50px;
}

.footer .links h4 {
font-size: 1.05rem;
font-weight: 400;
}

.footer .footer-newsletter h4 {
font-size: 1rem;
font-weight: bold;
position: relative;
}

.footer .footer-content .footer-links ul {
list-style: none;
padding: 0;
}

.footer .footer-content .footer-links ul i {
margin-right: 0;
color: var(--color-primary);
font-size: 1rem;
line-height: 0;
}

.footer .footer-content .footer-links ul li:first-child {
padding-top: 15px;
}

.footer .footer-content .footer-links ul a:hover {
color: white;
}

.footer .footer-legal p {
font-size: 0.75rem;
}

.footer .copyright {
font-size: 0.6rem !important;
margin-bottom: 0 !important;
}

.footer .btn-u {
  position: absolute;
  right: -2px;
  bottom: 0;
  border: 0;
  background: none;
  font-size: 28px;
  padding: 1.5px 1.25rem 0;
  background: none;
  color: var(--highlightcolor);
  transition: 0.3s;
  border-radius: 0 4px 4px 0;
}

.footer .footer-newsletter p {
  font-weight: 400;
}

@media (min-width: 1540px) {
  .footer {
    padding: 3vw 6vw 0.5vw;
  }

  .footer .footer-content .footer-links {
    padding-left: 3%;
    display: flex;
  }

  .footer .footer-newsletter p {
    padding: 0 !important;
    font-size: 1.05rem;
  }

  #footer .show0 {
    visibility: hidden;
    display: none;
    height: 0;
  }

  #footer .show1 {
    visibility: visible;
  }

  .footer .copyright {
    padding: 2vw 0 0 0.1rem;
  }

  .footer .social-links {
    margin-top: 4vw;
  }

  .footer .footer-info {
    margin-right: 0vw;
  }

  .footer .footer-info p{  
    line-height: 1.3;
    font-size: 1rem;
    letter-spacing: 0.04rem;
  }

  .footer .footer-content .footer-links {
    justify-content: space-between;
    padding: 0;
  }

  .footer .links {
    display: flex;
    justify-content: center;
  }

  .footer .footer-content .footer-links ul li {
    padding: 0.6rem 0;
    transition: 0.3s;
    line-height: 1;
    font-size: 0.9rem;
    letter-spacing: 0.05rem;
    }

    .footer .btn-u {
      top: 0;
    }
}
  
@media (min-width: 1400px) and (max-width: 1539px) {
  .footer {
    padding: 3vw 6vw 0.5vw;
  }

  .footer .footer-newsletter p {
    padding: 0 !important;
    font-size: 1.05rem;
  }

  #footer .show0 {
          visibility: hidden;
      display: none;
    height: 0;
  }

  #footer .show1 {
    visibility: visible;
  }

  .footer .copyright {
    padding: 1.5vw 0 0.7rem 0.1rem;
  }
  
  .footer .footer-content .footer-links {
    padding-left: 2%;
    display: flex;
  }

  .footer .footer-info {
    padding-right: 3vw;
  }

  .footer .footer-info p{  
    font-size: 1rem;
    padding: 0 0 16px 0 !important;
  }

  .footer .footer-content .links {
    justify-content: space-evenly;
    padding: 0;
  }

  .footer .footer-content .footer-links ul li {
    padding: 0.5rem 0;
    transition: 0.3s;
    line-height: 1;
    font-size: 0.9rem;
    letter-spacing: 0.05rem;
    }

  .footer .social-links {
    margin-top: 4vw;
  }

  .footer .links {
    display: flex;
    justify-content: space-evenly;
  }

  .footer .btn-u {
    top: 0px;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .footer {
    padding: 3vw 5vw 0.5vw 5vw;
  }

  #footer .show0 {
    visibility: hidden;
    display: none;
  }

  #footer .show1 {
    visibility: visible;
  }

  .footer .copyright {
    padding: 5vw 0 0.7rem 0.1rem;
  }

  .footer .footer-content .footer-links {
    padding-left: 2%;
  }

  .footer .footer-info {
    padding-right: 3vw;
  }

  .footer .footer-info p{  
    font-size: 1rem;
    padding: 0 0 14px 0 !important;
  }

  .footer .footer-content .footer-links {
    justify-content: space-between;
    padding: 0;
    display: flex;
  }

  .footer .social-links {
    margin-top: 4vw;
  }

  .footer .footer-newsletter p {
    padding: 0 !important;
    font-size: 1.05rem;
  }

  .footer .footer-content .footer-links ul li {
    padding: 0.5rem 0;
    transition: 0.3s;
    line-height: 1;
    font-size: 0.9rem;
    letter-spacing: 0.05rem;
  }

  .footer .links {
    display: flex;
    justify-content: start;
  }

  .footer .btn-u {
    top: 1px;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {  
  .footer {
    padding: 3vw 5vw 0.5vw 5vw;
  }

  #footer .show0 {
          visibility: hidden;
    display: none;
  }

  #footer .show1 {
    visibility: visible;
  }

  .footer .copyright {
    padding: 4vw 0 0.7rem 0.1rem;
  }

  .footer .footer-content .footer-links {
    padding-left: 4%;
  }

  footer .social-links {
    justify-content: right;
  }

  .footer .footer-info {
    padding-right: 3vw;
  }

  .footer .footer-info p{  
    font-size: 0.9rem;
    padding: 0 0 14px 0 !important;
  }

  .footer .footer-content .footer-links {
    justify-content: space-between;
    padding: 0;
    display: flex;
  }

  .footer .social-links {
    margin-top: 4vw;
  }

  .footer .footer-newsletter p {
  padding: 0 !important;
  font-size: 1.00rem;
  letter-spacing: 0;
  }

  .footer .footer-content .footer-links ul li {
    padding: 0.5rem 0;
    transition: 0.3s;
    line-height: 1;
    font-size: 0.85rem;
    letter-spacing: 0rem;
  }

  .footer .links {
    display: flex;
    justify-content: space-evenly;
  }

  .footer .btn-u {
    top: 1px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {  
  .footer {
    padding: 3vw 8vw 0.5vw 8vw;
  }

  #footer .show0 {
    visibility: hidden;
    display: none;
  }

  #footer .show1 {
    padding-top: 35px;
    visibility: visible;
  }

  .footer .container {
    max-width: 90% !important;
  }

  .footer .copyright {
    padding: 4vw 0 0.7rem 0.1rem;

  }

  .footer .footer-info {
    padding-bottom: 6vw;
  }

  .footer .footer-content .footer-links {
    justify-content: space-around;
    padding: 0.75rem 0 0 0.75rem;
    display: flex;
  }

  .footer .footer-newsletter p {
  padding: 0 !important;
  font-size: 1.05rem;
  }

  .footer .footer-content .footer-links ul li {
    padding: 0.5rem 0;
    transition: 0.3s;
    line-height: 1;
    font-size: 0.9rem;
    letter-spacing: 0.05rem;
  }

  .footer .links {
    display: flex;
    justify-content: space-evenly;
  }

  .footer .btn-u {
    top: 0;
  }
}

@media (min-width: 576px) and (max-width: 767px) {  
  .footer {
    padding: 3vw 8vw 0.5vw 8vw;
  }

  .footer .copyright {
    padding: 3vw 0 0.7rem 0.1rem;
  }

  #footer .show0 {
    visibility: hidden;
    display: none;
  }

  #footer .show1 {
    padding-top: 20px;
          visibility: visible;
  }

  .footer .footer-info {
    padding-right: 3vw;
  }

  .footer .footer-content .footer-links {
    padding: 3rem 0 0rem .75rem;
    display: grid;
  }

  .footer-newsletter {
    display: grid;
    justify-content: center !important;
  }

  .footer .footer-newsletter p {
  padding: 0 !important;
  font-size: 1.05rem;
  }

  .footer .footer-content .footer-links ul li {
    padding: 0.5rem 0;
    transition: 0.3s;
    line-height: 1;
    font-size: 0.9rem;
    letter-spacing: 0.05rem;
  }

  .footer .links {
    padding-left: 0;
    display: flex;
    justify-content: space-around;
  }

  .footer .btn-u {
    top: 0;
  }
}

@media (max-width: 575px) {  

  .footer {
    padding: 11vw 8vw 0.5vw 8vw;
  }

  .footer h4 {
    font-size: 1rem;
    letter-spacing: 0;
  }

  #footer .show0 {
    visibility: hidden;
    display: none;
  }

  #footer .show1 {
    visibility: visible;
    padding-top: 25px;
  }

  .footer .footer-content .footer-links {
    justify-content: flex-start;
    padding: 3rem 0 2rem .75rem;
    display: grid;
  }

  .footer .footer-newsletter p {
    padding: 0 !important;
    font-size: 1.05rem;
  }

  .footer .footer-content .footer-links ul li {
    padding: 0.5rem 0;
    transition: 0.3s;
    line-height: 1;
    font-size: 0.85rem;
    letter-spacing: 0.04rem;
  }

  .footer .links {
    order: 2;
    padding-left: 0;
    display: flex;
    justify-content: space-around;
  }

  .footer .btn-u {
    top: 1px;
  }
}

@media (max-width: 1199px) {
  .client-news {
    display: none;
  }
}
  
@media (max-width: 992px) {
  .footer .footer-content .social-links {
    justify-content: center;
  }  
}

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

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

#footer .footer-newsletter form {
  margin-top: 1.4rem;
  background: #fff;
  padding: 0.4rem 0.7rem;
  position: relative;
  border-radius: 4px;
}

#footer .footer-newsletter form input[type=email] {
  border: 0;
  padding: 0.25rem;
  width: calc(100% - 50px);
  font-size: 14px;
}

#footer .footer-newsletter form input[type=submit] {
  position: absolute;
  top: 0;
  right: -2px;
  bottom: 0;
  border: 0;
  background: none;
  font-size: calc(13px + 0.15vw);
  padding: 0 1.25rem;
  background: var(--highlightcolor);
  color: #fff;
  transition: 0.3s;
  border-radius: 0 4px 4px 0;
}

#footer .footer-newsletter form input[type=submit]:hover {
  background: var(--highlightcolor);
}

.footer .input-field {
  display: none;
}