/***************************************************************************/
/*Start: trending Slider css:nla*/

/***************************************************************************/
.container-slider-nla {
  width: 900px;

  margin: 0 auto;
  max-width: 100%;
}

.container-slider-nla .slick-slider {
  margin-left: -12%;
  margin-right: -12%;
}

.container-slider-nla .slick-list {
  padding-top: 5%!important;
  padding-bottom: 5%!important;
  padding-left: 15%!important;
  padding-right: 15%!important;
}

.container-slider-nla .slick-dots {
  text-align: right;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.container-slider-nla .slick-controls .slick-dots li.slick-active button{
background-color:#1845F5 !important;
}
.container-slider-nla .slick-controls .slick-dots li button {
    background-color: #ffffff94 !important;
}
.slick-dots li.slick-active button:before {
    opacity: 1;
    color: #1845F5 !important;
    font-size: 10px;
}
.slick-dots li button:before{
    color:#fff !important;
}
.slick-dots{
        bottom: -35px !important;
}
.container-slider-nla .slick-track {
  max-width: 100%!important;
  transform: translate3d(0, 0, 0)!important;
  perspective: 100px;
}

.container-slider-nla .slick-slide {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
  width: 100%!important;
  transform: translate3d(0, 0, 0);
  transition: transform 1s, opacity 1s;
}

.container-slider-nla .slick-snext,
.container-slider-nla .slick-sprev,
.container-slider-nla .slick-snext2,
.container-slider-nla .slick-sprev2 {
  display: block;
}

.container-slider-nla .slick-current {
  opacity: 1;
  position: relative;
  display: block;
  z-index: 2;
}
.slick-dots li{
    margin: 0px !important;
}

.container-slider-nla .slick-snext {
  opacity: 1; /* Lower opacity */
  transform: translate3d(30%, 0, -30px); /* Move to the right */
  z-index: 1;
  perspective: 1000px;
}

.container-slider-nla .slick-snext2 {
  opacity: 1; /* Lower opacity even more */
  transform: translate3d(50%, 0, -50px); /* Move further to the right */
  z-index: 0;
  perspective: 1000px;
}
.container-slider-nla a.slide-button {
    width: 115px;
    left: 387px;
    border-radius: 12px;
    padding: 9px 12px;
    color:#1845F5;
    font-family: ABeeZee;
    font-size: 14px;
    font-weight:bold;
    line-height: 16.55px;
    letter-spacing: 0.03em;
    text-align: center;
    background-color: white;
}

.container-slider-nla .slick-sprev {
  opacity: 1; /* Lower opacity */
  transform: translate3d(-30%, 0, -30px); /* Move to the left */
  z-index: 1;
}

.container-slider-nla .slick-sprev2 {
  opacity: 1; /* Lower opacity even more */
  transform: translate3d(-50%, 0, -50px); /* Move further to the left */
  z-index: 0;
}
.junior-trend .container-slider-nla .slide-content h2{
    font-family:"Lilita One", Sans-serif ;
    letter-spacing:2px;
    font-weight:500;
}
.young-explorer .container-slider-nla .slide-content h2 {
    font-family:roboto;
    
}
.junior-trend .container-slider-nla .slide-content p{
    font-family:"ABeeZee", Sans-serif;
}
.young-trend .container-slider-nla a.slide-button{
    font-family:Jost;
    color:#3B9B9B;
}
.container-slider-nla .nla-main-slide {
  display: flex;
  gap:30px;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  padding:20px 20px;

  background: #FF0061;
  border-radius:33px;
  /*height: 440px;*/
  
}

.container-slider-nla .slide-content h2 {
   font-family:Roboto;
    color: white;
    font-size: 24px;
   /*font-weight: 700;*/
   line-height: 28.13px;
   letter-spacing: 0.03em;
}
.young-explorer .container-slider-nla a.slide-button, .young-explorer.junior-trend .container-slider-nla .slide-content p {
        font-family: Jost;
}
.container-slider-nla .slide-content p {
    font-family: Jost;
    font-size: 13px;
    font-weight: 400;
    line-height: 20.23px;
    letter-spacing: 0.03em;
    text-align: left;
    color:white;
   margin-bottom: 7px; 

}
.container-slider-nla .slide-content {
    display: flex;

    flex-direction: column;
}

.container-slider-nla .slick-slide img{
    width: 320px;
    height: 320px;
    border-radius: 12px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.container-slider-nla .junior-trend .slide-content h2{
   font-family: "Lilita One", Sans-serif;

}
.container-slider-nla .junior-trend .slide-content p {
 font-family:ABeeZee, sans-serif;
 
}
/*************************************************************************
End: trending Slider css:nla

*************************************************************************/
.container-slider-nla .slick-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px; /* Spacing between dots and arrows */
  margin-top: 20px;
}

.container-slider-nla .slick-controls .slick-prev,
.container-slider-nla .slick-controls .slick-next {
  background-color: #000;
  color: #fff;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
}

.container-slider-nla .slick-controls .slick-prev:hover,
.container-slider-nla .slick-controls .slick-next:hover {
  background-color: #555;
}

.container-slider-nla .slick-controls .slick-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  list-style: none;
}

.container-slider-nla .slick-controls .slick-dots li {
  display: inline-block;
}

.container-slider-nla .slick-controls .slick-dots li button {
  background-color: #fff;
  border: none;
  margin: 21px 0px;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  cursor: pointer;
}
.container-slider-nla .slick-controls .slick-dots {
    bottom: 30px !important;
}
.container-slider-nla .slick-dots li button:before{
    display:none;
}
.container-slider-nla .slick-controls .slick-dots li.slick-active button {
  background-color: #000;
}




/* Styling for the slider */
.slider {
    width: 100%;
    margin: 0 auto;
}

.slider-item-box {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
}

/* Default styling for each slider item */
.slider_item {
    width: 100%;
    max-width: 300px; /* Adjust the size of your slides */
    margin: 0 auto;
    text-align: center;
    transition: transform 0.3s ease; /* Smooth zoom effect */
}

/* Zoom effect for the center slide */
.slick-center .slider_item {
    transform: scale(1.09); /* Zoom effect for the centered slide */
    transition: transform 0.3s ease;
}

/* Make the previous and next slides partially hidden */
.slick-slide {
    margin: 0 -15px; /* Adjust margin to make slides hidden behind */
}
.slick-initialized .slick-slide {
    width: 320px;
}
.slick-prev, .slick-next {
    font-size: 20px;
    color: #333;
}
.spot .slick-slide img {
    border: 7px solid white;
    border-radius: 16.27px;
}
.slick-prev {
    left: -40px; /* Move prev arrow slightly to the left */
}

.slick-next {
    right: -40px; /* Move next arrow slightly to the right */
}

/* Add smooth transition to images */
.slick-slide img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px; /* Optional: Add rounded corners to the images */
}

/* Adjust the layout on mobile screens */
@media (max-width: 768px) {
    .container-slider-nla .slide-content h2,.container-slider-nla .slide-content p  {
        text-align:center;
    }
    .slick-prev, .slick-next {
        display: none;
    }
    button.slick-arrow {
    display:none !important;
}
}
/*css for arrows*/
button.slick-arrow {
    font-size: 0;
    border: unset;
}

button.slick-arrow:before {
   /*display:none;*/

}
.spot button.slick-arrow:before {
    /*color: #fff;*/

}
button.slick-arrow:hover {
    background-color: unset !important;


}
button.slick-arrow:focus{
    background-color:unset!important;
}
.spot button.slick-prev.slick-arrow {
    padding: 0 40px 0 0;
}
.spot button.slick-next.slick-arrow {
    padding:0;
}


/* Portrait orientation */
@media only screen and (min-width: 768px) and (max-width: 834px) and (orientation: portrait) {
      /* Styles for iPad Mini and iPad Air in portrait */
.container-slider-nla .nla-main-slide {
    display: flex;
    flex-direction: column ;
}
    .container-slider-nla .slick-track {
    max-width: 60% !important;
    }
.container-slider-nla .slide-content{
    align-items: center;
}
.slick-slide{
        height: max-content !important;
    }
    .container-slider-nla .slick-sprev2 {
    transform: translate3d(-100%, 0, -50px);
}
.container-slider-nla .slick-sprev{
    transform: translate3d(-70%, 0, -50px);
}
.container-slider-nla .slick-snext2{
     transform: translate3d(100%, 0, -55px);
}
    .container-slider-nla .slick-snext{
          transform: translate3d(60%, 0, -40px); 
    }
.container-slider-nla .slick-slide img {
    width: 220px;
    height: 220px;
}
.slide-content p:nth-last-of-type(2) {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 10; /* Limits to 7 lines */
    line-clamp: 10; /* Non-prefixed fallback */
}

}

/* Landscape orientation for ipad pro */
@media only screen and (min-width: 1024px) and (max-width: 1194px) and (orientation: landscape) {
  /* Styles for iPad Mini and iPad Air in landscape */
.container-slider-nla .nla-main-slide {
    display: flex;
    flex-direction: column ;
}
}
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: portrait),
only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: landscape) {
      .slide-content p:nth-last-of-type(2) {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 8; /* Limits to 7 lines */
    line-clamp: 8; /* Non-prefixed fallback */
}
.junior-trend .container-slider-nla .slide-content h2{
    margin: 0px !important;
}
.container-slider-nla .slick-snext{
transform: translate3d(30%, 0, -35px);
}
.container-slider-nla .slick-sprev{
transform: translate3d(-30%, 0, -39px);
    
}

    .container-slider-nla .nla-main-slide {
       /*height: 440px;*/
       display: flex;
        flex-direction: row;
    }
    .slick-current.slick-active .nla-main-slide{
    height:min-content !important;
}
}
 /*Target devices with a width of 768px or smaller */
@media (max-width: 768px) {
 .container-slider-nla .slick-list {
  padding-left: 10%!important;
  padding-right:10%!important;
}
 .container-slider-nla .junior-trend .slide-content h2{
 font-size:20px;

}
.container-slider-nla .junior-trend .slide-content p {
 font-size:12px;
 
} 
.container-slider-nla .slick-slide img {
    width: 200px;
    height: 200px;
}
.container-slider-nla .nla-main-slide {
    gap:0px;
    height: min-content;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.container-slider-nla .slide-content {
    align-items: center;
}

.container-slider-nla .slick-current .nla-main-slide {
    height:fit-content;
  }
  .container-slider-nla .slick-slider {
  margin-left: unset;
  margin-right:unset;
}
  
 .container-slider-nla .slick-sprev,.container-slider-nla .slick-snext,.container-slider-nla .slick-sprev2,.container-slider-nla .slick-snext2 {
    /*display: none !important;*/
}


}

@media screen and (width: 1024px) and (height: 600px) and (orientation: landscape) {
    /* Styles specific to Google Nest Hub (1st Gen) */
.junior-trend .container-slider-nla .slide-content h2, .junior-trend .container-slider-nla .slide-content p{
    text-align:center;
}
    .container-slider-nla .slide-content{
        align-items:center;
    }
    .container-slider-nla .nla-main-slide{
        height:min-content;
    }
}

/*mobile queries only*/
@media only screen and (max-width: 760px) {
    
 .container-slider-nla .slick-sprev,.container-slider-nla .slick-snext,.container-slider-nla .slick-sprev2,.container-slider-nla .slick-snext2 {
    display: none !important;
}  
}