/**
*
*
*    Instagram Feed
*    Copyright 2024 Inno-mods.io
*
*    @author    Inno-mods.io
*    @copyright Inno-mods.io
*    @version   1.1.0
*    Visit us at https://www.inno-mods.io
*
*
**/
/*
* profile info
*/
.instagram-feed-widget{
  text-align: center;
  background: #f6f5f4;
}

.instagram-feed-widget .profile{
  display: inline-flex;
  align-items: center;
  padding: 10px;
}

.instagram-feed-widget .profile .thumb{
  border-radius: 75px;
  border: 1px solid #222;
  overflow: hidden;
}

.instagram-feed-widget .profile .thumb img{
  width: 75px;
}

.instagram-feed-widget .profile .details{
  padding: 10px 10px 10px 10px;
}

.instagram-feed-widget .profile .details.padding-right{
  padding-right: 50px;
}

.instagram-feed-widget .profile .details .name{
  font-weight: bold;
  display: block;
  text-align: left;
  color: #222222;
}

.instagram-feed-widget .profile .details .username{
  font-size: 14px;
  display: block;
  text-align: left;
}

.instagram-feed-widget .profile .infos{
  display: flex;
  align-items: center;
}

.instagram-feed-widget .profile .infos div{
  padding: 10px;
  text-align: center;
}

@media only screen and (max-width: 576px) {
  .instagram-feed-widget .profile .infos{
    display: none;
  }
  .instagram-feed-widget .profile .details{
    padding: 10px;
  }
}

/*
* media (grid & slider) wrapper
*/
.instagram-feed-widget .media{
  display: flex;
  width: 100vw;
  position: relative;
  margin-left: -50vw;
  left: 50%;
  flex-wrap: wrap;
}

/*
* instagram card (for both grid & slider)
*/
.instagram-feed-widget .media .card{
  overflow-y: hidden;
  display: flex;
  position: relative;
  align-items: center;
  background: #000;
  margin: 0;
  overflow-x: hidden;
  flex-direction: unset;
}

.instagram-feed-widget .media .card img{
  width: 100%;
}

.instagram-feed-widget .media .card .card-info-wrapper{
  position: absolute;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
  overflow: hidden;
  height: 0;
  transition: .5s ease;
  color: #fff;
  font-size: 14px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  align-items: center;
}

.instagram-feed-widget .media .card:hover .card-info-wrapper {
  height: 100%;
}

.instagram-feed-widget .media .card .card-info-wrapper .card-info {
  background: none;
  color: #fff;
}

.instagram-feed-widget .media .card .card-info-wrapper .card-info .likes-comments {
  display: inline-flex;
  align-items: center;
}

.instagram-feed-widget .media .card .card-info-wrapper .card-info .likes-comments .icon {
  padding: 10px 0 10px 0;
  display: inline-block;
}

.instagram-feed-widget .media .card .card-info-wrapper .card-info .likes-comments .icon svg{
  width: 25px;
}

.instagram-feed-widget .media .card .card-info-wrapper .card-info .likes-comments .text {
  padding: 10px 10px 10px 5px;
  display: inline-block;
}

.instagram-feed-widget .media .card .card-info-wrapper .card-info .caption {
  max-height: 60px;
  overflow: hidden;
}

/*
* instagram card widths & height for all screens (for both grid & slider)
*/
@media only screen and (max-width: 576px) {
  .instagram-feed-widget .media .card{
    width: calc(50vw);
    height: calc(50vw);
  }
  .instagram-feed-widget .media .card .card-info-wrapper{
    /*width: calc(50vw - 40px);*/
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info{
    width: 100%;
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info .caption{
    width: 100%;
  }
  .instagram-feed-widget .media .card.card-md,
  .instagram-feed-widget .media .card.card-lg{
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 992px) {
  .instagram-feed-widget .media .card{
    width: calc(25vw);
    height: calc(25vw);
  }
  .instagram-feed-widget .media .card .card-info-wrapper{
    /*width: calc(25vw - 40px);*/
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info{
    width: 100%;
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info .caption{
    width: 100%;
  }
  .instagram-feed-widget .media .card.card-lg{
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1400px) {
  .instagram-feed-widget .media .card{
    width: calc(16vw);
    height: calc(16vw);
  }
  .instagram-feed-widget .media .card .card-info-wrapper{
    /*width: calc(16vw - 40px);*/
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info{
    width: 100%;
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info .caption{
    width: 100%;
  }
  .instagram-feed-widget .media .card.card-lg{
    display: none;
  }
}

@media only screen and (min-width: 1400px) {
  .instagram-feed-widget .media .card{
    width: calc(12.5vw);
    height: calc(12.5vw);
  }
  .instagram-feed-widget .media .card .card-info-wrapper{
    /*width: calc(12.5vw - 40px);*/
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info{
    width: 100%;
  }
  .instagram-feed-widget .media .card .card-info-wrapper .card-info .caption{
    width: 100%;
  }
}


/*
* swipper slider buttons
*/
.instagram-feed-widget .swiper-buttons .swiper-button-prev, .instagram-feed-widget .swiper-buttons .swiper-button-next{
  width: 80px;
  height: 80px;
  margin: -40px;
}

.instagram-feed-widget .swiper-buttons .swiper-button-next{
  margin: -40px;
}

.instagram-feed-widget .swiper-buttons .swiper-button-next{
  margin: -42px;
}

.instagram-feed-widget .swiper-buttons .swiper-button-prev:after, .instagram-feed-widget .swiper-buttons .swiper-button-next:after{
  color: #fff;
  background: rgba(0, 0, 0, 0.9);
  font-size: 23px;
  border-radius: 40px;
  width: 80px;
  height: 80px;
  display: flex;
  align-items: center;
}

.instagram-feed-widget .swiper-buttons .swiper-button-prev:after{
  padding: 0 0 0 45px;
}

.instagram-feed-widget .swiper-buttons .swiper-button-next:after{
  padding: 0 0 0 20px;
}

.instagram-feed-widget .swiper-buttons .swiper-button-prev.swiper-button-disabled, .instagram-feed-widget .swiper-buttons .swiper-button-next.swiper-button-disabled{
  pointer-events: unset;
}