*{
     box-sizing: border-box;
}
 body {
     margin: 0;
    background: #f0f0f0;
}
 
 .box{
     max-width: 300px;
     width: 100%;
     padding: 0 15px;
}
 .skeleton {
     padding:15px;
     max-width: 300px;
     width: 100%;
     background: #fff;
     margin-bottom: 20px;
     border-radius: 5px;
     display: flex;
     justify-content: center;
     align-items: center;
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12);
}
 .skeleton .square {
     height: 80px;
     border-radius: 5px;
     background: rgba(130, 130, 130, 0.2);
     background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
     background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
     background-size: 800px 100px;
     animation: wave-squares 2s infinite ease-out;
}
 .skeleton .line {
     height: 12px;
     margin-bottom:6px;
     border-radius: 2px;
     background: rgba(130, 130, 130, 0.2);
     background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
     background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
     background-size: 800px 100px;
     animation: wave-lines 2s infinite ease-out;
}
 .skeleton-right{
    flex:1;
}
 .skeleton-left{
    flex:2;
    padding-right:15px;
}
 .flex1{
    flex: 1;
}
 .flex2{
    flex: 2;
}
 .skeleton .line:last-child{
    margin-bottom: 0;
}
 .h8{
    height: 8px !important;
}
 .h10{
    height: 10px !important;
}
 .h12{
    height: 12px !important;
}
 .h15{
    height: 15px !important;
}
 .h17{
    height: 17px !important;
}
 .h20{
    height: 20px !important;
}
 .h25{
    height: 25px !important;
}
 .w10{
    width: 10% !important
}
.w15{
    width: 15% !important
}
.w20{
    width: 20% !important
}
.w25{
    width: 25% !important
}
 .w40{
    width:40% !important;
}
 .w50{
    width: 50% !important
}
 .w75{
    width: 75% !important
}
 .m0{
    margin-bottom: 0px !important;
}
.m5{
    margin-bottom: 5px !important;
}
.m10{
    margin-bottom: 10px !important;
}
 .circle{
    border-radius: 50% !important;
     height: 80px !important;
     width: 80px;
}
 @keyframes wave-lines {
    0% {
        background-position: -468px 0;
    }
     100% {
        background-position: 468px 0;
    }
}
 @keyframes wave-squares {
    0% {
        background-position: -468px 0;
    }
     100% {
        background-position: 468px 0;
    }
}
.modify-search-loader{
    display:flex;
    align-items:center;
    justify-content:space-between;
     padding:15px;
     width: 100%;
     background: #fff;
    margin-top: 15px;
    margin-bottom: 30px;
}
.s-box-loader{
    width:16%;
}
.modify-search-loader .line,
.another-toggle-loader .line,
.banner-list-text-loader .line,
.myselect-flight-loader .line,
.price_details-loader .line,
.flight-details-loader-div .line{
     height: 12px;
     margin-bottom:6px;
     border-radius: 2px;
     background: rgba(130, 130, 130, 0.2);
     background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
     background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
     background-size: 800px 100px;
     animation: wave-lines 2s infinite ease-out;
}
.another-toggle-loader, 
.banner-list-text-loader,
.myselect-flight-loader,
.price_details-loader{
    padding:15px;
    width: 100%;
    background: #fff;
}
.another-toggle-loader{
    border-bottom: 1px dashed #dedede;
}
.s-text-toggle{
    
}
.banner-list-text-loader, .flight-list-loader{
    margin-bottom:15px;
}
.skeleton .square,
.flights-details-loader .square{
     height: 40px;
     width:40px;
     border-radius: 5px;
     background: rgba(130, 130, 130, 0.2);
     background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
     background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
     background-size: 800px 100px;
     animation: wave-squares 2s infinite ease-out;
}
.banner-loader{
    padding: 15px;
    width: 100%;
    background: #fff;
    margin-bottom:15px;
}
.list-banner-loader-1{
     height: 25vh;
     width:100%;
     border-radius: 5px;
     background: rgba(130, 130, 130, 0.2);
     background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
     background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
     background-size: 800px 100px;
     animation: wave-squares 2s infinite ease-out;
}
.list-banner-loader-2{
     height: 45vh;
     width:100%
     border-radius: 5px;
     background: rgba(130, 130, 130, 0.2);
     background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
     background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
     background-size: 800px 100px;
     animation: wave-squares 2s infinite ease-out;
}
.flights-details-loader{
    display: flex;
    align-items: center;
    justify-content: start;
}
.ainfo-loader{
    width: 35%;
    display: flex;
    align-items: center;
    justify-content: start;
}
.duration-details-loader{
    width: 65%;
    display: flex;
    align-items: center;
    justify-content: start;
}
.departure-details-loader{
    width: 20%;
}
.durationinner-loader{
    width: 60%;
}
.airport-dtl-loader{
    
}
.arrival-details-loader{
    width: 20%;
}
.inf-loader{
    width:100%;
    margin-left:10px;
}
.m-auto{
    margin:auto!important;
}
.ml-mr-auto{
    margin-left:auto;
    margin-right:auto;
}
.ml-auto{
    margin-left: auto!important;
}
.select-flight-main-info-loader{
    overflow:auto;
    border-bottom: 1px dashed #dedede;
}
.price_details-loader{
    float: right;
    width: 25%;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
}
.myselect-flight-loader{
    float: left;
    width: 75%;
    height: 80px;
    border-right: 1px dashed #dedede;
}
.mysaelect-flight-title-loader{
    width:100%;
}
.flight-details-loader-div{
    padding:5px 15px;
    width: 100%;
    background: #fff;
}
.bound-loader{
   display:flex;
   align-items:center;
   justify-content:space-between;
   
}
.s-bound{
    width:48%;
   height:50px;
     border-radius: 5px;
     background: rgba(130, 130, 130, 0.2);
     background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
     background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
     background-size: 800px 100px;
     animation: wave-squares 2s infinite ease-out;
}
.skelton-loader{
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0;
    bottom: 0;
    background: #f2f2f2;
    padding-top:80px;
    z-index: 90;
    overflow: hidden;
}
@media only screen and (max-width: 991px) {
  .skelton-loader {
    padding-top:70px;
}
.mhide-loader{
    display:none;
}
}