.index-app-title{
        color:white;
        font-size: 1.5em;
        font-weight: 700;
         font-family: 'Poppins', sans-serif;
        text-align:center;
         margin: 0;
        padding: 0;
    }

    .index-box {
        width: 95vw;
  background: #1F222B;
  border-radius: 16px;
  padding: 28px 32px 32px 32px;

}

    .index-small-title {
        font-size: 1rem;
         text-align: left; 
         color: white;
         font-weight: 500;
    }

    .index-content {
         font-size: 0.8rem;
          text-align: left;
        font-weight: 50;
      
        color:  #9EB3C9;

    }

     .logoWordLingo {
        width: 22vw;
        height: 22vw;
        border-radius: 25px;
       
    }

 

      .chevron-button {
        cursor: pointer;
    }

    .coming-soon {
     
        display: flex;
  align-items: center;
  justify-content: center;
        /* width: 150px;*/
        height: 45px;
        top:0;
        left:0;
        border-radius: 8px;
        background-color: #007AFF;
        padding-left: 15px;
        padding-right: 15px;
        margin: 0;
        font-size: 1.1em;
        font-family: 'Poppins', sans-serif;
        color: white;
      
       
    }

    .downloadButton {
              display: flex;
  align-items: center;
  justify-content: center;
        /* width: 150px;*/
        height: 45px;
        top:0;
        left:0;
        border-radius: 8px;
        pointer-events: none;
        /*background-color: #007AFF;
        padding-left: 15px;
        padding-right: 15px;
        margin: 0;
        font-size: 1.1em;
        font-family: 'Poppins', sans-serif;
        color: white;*/


    }

     .content {
        min-height: 450px;
        width: 100%;
          display: flex;
        flex-direction: column;
      justify-content: center;
      align-items: center;
        gap: 60px;

      
    }



@media only screen and (min-width: 850px) {

   .index-hstack {
      display: flex !important;
        flex-direction: row !important;
       /* gap: 15px;*/
    }

    .carousel-image {
        height: 650px; 
    }

}





/* For ipad */
@media only screen and (min-width: 575px) and (max-width: 850px){

    .index-hstack {
      display: flex !important;
        flex-direction: column !important;
        gap: 15px;
    }

    .carousel-image {
        height: 650px; 
    }

}

/* For iphone */
@media only screen and (max-width: 575px){

 .coming-soon {
  height: 35px;
    font-size: 1em;
 }

    .index-box {
        width: 95vw;

    }

    .carousel-image {
        width: 70vw;
       
    }

    .carouselStack {
          margin-left: -32px;
           margin-right: -32px;
    }
}