@charset "utf-8";
/* CSS Document */


/*trail details css start*/

.insimg-box{height: 180px;overflow: hidden;    position: relative;}
.insimg-details a{text-decoration: underline !important;}
.ins-img{border:1px solid ;position: relative;margin-bottom: 30px;    min-height: 280px;}
.insimg-box img{width: 100%;height: 100%; object-fit: cover;}
.insimg-details h4{font-size: 1.3rem;margin-bottom: 5px;    color: #f6461d;}
.insimg-details h6{font-size: 1rem;margin-bottom: 15px;font-weight: 600;}
.insimg-details h6 small{display: block;margin-top: 3px;}
.b1{border-color: #7570b3;}
.b1 h6, .b1 i{color: #7570b3;}
.b2{border-color: #f4471d;}
.b2 h6, .b2 i{color: #f4471d;}
/*
.b3{border-color: #829b48;}
.b3 h6, .b3 i{color: #829b48;}
.b4{border-color: #4c97ac;}
.b4 h6, .b4 i{color: #4c97ac;}
*/

.insimg-details{padding: 15px;}
.ins-img:after{content: "";
    position: absolute;
    right: 44px;
    bottom: -11px;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    transition: .5s;
    z-index: 1;
    background-color: #ccc;}

.interested .card-body {
    padding: 0px;
}
.ins-img.b1:after{background-color:#7570b3;}
.ins-img.b2:after{background-color:#f4471d;}

.boxhover{position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    color: #fff;
    padding: 15px;
  display: none;}
.bg--orange{background-color: #f84525 !important;color: #ffffff}
.ins-img.b1 .boxhover{background-color:#7570b3;}
.ins-img.b2 .boxhover{background-color:#f4471d;}

.ins-img:hover .boxhover,.ins-img.active .boxhover{display: block;animation: hovereffect .5s ease-in-out;}
.ins-img:hover h6,.ins-img.active h6{
    color: #FFEB3B !important;
    transition: .5s ease-in-out;
    font-weight: 700;
    /* background: #cfac44; */
    /* padding: 2px 8px; */
    }
/*.ins-img .boxhover p{padding: .2em 0 .5em 0;}*/
.ins-img .boxhover span{    font-weight: 500;
    color: #FFEB3B;
    padding: 2px;
    display: block;
    margin-bottom: 1em;
    }
@keyframes hovereffect {
  0% {
  opacity: 0;
 top:100%;

  }
  
  100% {
  opacity: 1;
  top:0;
	  
  }
}

/*trail details css end*/
@media (max-width:768px){
    .boxhover{display: block;position: inherit;}
    .insimg-box {height: 160px;overflow: hidden;position: relative;width: 100%;}
    .insimg-details h6 {font-size: 1em; margin-bottom: 5px;font-weight: 600;}
    .insimg-details {padding: 15px 0 0 0;line-height: 130%;}
    .ins-img.b1 .boxhover {background-color: #ffffff; color: #000;}
    .ins-img.b1 .boxhover h6{display: none;}
    .ins-img:hover h6, .ins-img.active h6 {color: #7570b3 !important;}
    .ins-img .boxhover span {color: #7570b3;}
    .ins-img{padding: 10px;}
    .boxhover{padding: 7px 0px 0px 0px;}
    .insimg-details p{display: none;}
    
}


@media (max-width:576px){
    .insimg-box {
        height: 70px;
        width: 90px;
        float: left;
        margin: 0 10px 4px 0;
    }
    
    .insimg-details{padding: 0px;}
    .ins-img{min-height: inherit;}
    .boxhover{clear: both}
    .ins-img:after{width: 10px;height: 10px;bottom: -5px;}
    .insimg-details h4{font-size: 1em;font-weight: 600;}
    .boxhover p{margin-bottom:.4rem; }
}