/*Text Selecting / Highlighting Color  */

 ::selection {
    color: white;
    background: #3399FF;
  }



 /* ll software Package showcase section */
 .viewLink{
    margin-top: -8px;
}

/*
    Hero Section
*/

.hero-title{
    font-size:60px;
    line-height: 80px;
}

.HeroBtn{
    border-radius: 25px;
}


/* Media Queries */

 /* Media Query for Mobile Devices */
 @media (max-width: 480px) {
    .hero{
        padding: 0 5%;
    }


    .hero-title{
        font-size:55px;
        line-height: 50px;
    }


 }

 /* Media Query for low resolution  Tablets, Ipads */
 @media (min-width: 481px) and (max-width: 767px) {

    .hero-title{
        font-size:55px;
        line-height: 50px;
    }

    .hero{
        padding: 0 5%;
    }


 }

 /* Media Query for Tablets Ipads portrait mode */
 @media (min-width: 768px) and (max-width: 1024px){

    .hero-title{
        font-size:50px;
        line-height: 50px;
    }
    .hero{
        padding: 0 5%;
    }
 }

 /* Media Query for Laptops and Desktops */
 @media (min-width: 1025px) and (max-width: 1280px){

    .hero-title{
        margin-top: 25px;
    }
    .hero{
        padding: 0 5%;
    }

 }

 /* Media Query for Large screens */
 @media (min-width: 1281px) {

    .hero-title{
        margin-top: 25px;
    }

 }

 /* Blog Section */

 .badge{
    border-radius: 25px;
}

.blogCard{
    border-radius: 20px;
    border: 0;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.card-img-top{
    border-radius: 20px;
}

/* 3 card section */

.cardSectionCard{
    background-color: #ebf2f86a;
    border-radius: 10px;
}

.infoIcon{
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    margin-top: -20px;
}


.akzSoftware{
    border-radius: 10px;
    background-color: #0274d819;
}







































/* Logo Slider */



:root {



    --marquee-width: 80vw;
    --marquee-height: 15vh;
    /* --marquee-elements: 12; */ /* defined with JavaScript */
    --marquee-elements-displayed: 5;
    --marquee-element-width: calc(var(--marquee-width) / var(--marquee-elements-displayed));
    --marquee-animation-duration: calc(var(--marquee-elements) * 5s);
  }

  .marquee {
    height: var(--marquee-height);
    overflow: hidden;
    position: relative;
  }
  .marquee:before, .marquee:after {
    position: absolute;
    top: 0;
    width: 10rem;
    height: 100%;
    content: "";
    z-index: 1;
  }
  .marquee:before {
    left: 0;
    background: linear-gradient(to right, #ffffff 0%, transparent 100%);
  }
  .marquee:after {
    right: 0;
    background: linear-gradient(to left, #ffffff 0%, transparent 100%);
  }
  .marquee-content {
    list-style: none;
    height: 100%;
    display: flex;
    animation: scrolling var(--marquee-animation-duration) linear infinite;
  }

  @keyframes scrolling {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-1 * var(--marquee-element-width) * var(--marquee-elements))); }
  }
  .marquee-content li {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: var(--marquee-element-width);
    max-height: 100%;
    font-size: calc(var(--marquee-height)*3/4);
    white-space: nowrap;
  }

  .marquee-content li img {
    width: 125px;
  }

  @media (max-width: 600px) {
    :root {
      --marquee-width: 100vw;
      --marquee-height: 16vh;
      --marquee-elements-displayed: 3;
    }
    .marquee:before, .marquee:after { width: 5rem; }
  }