@media (max-width:480px) {
    .col, [class*="col-"]{
  
    }
    .container {
        padding-right: 8px;
        padding-left: 13px;
    }
    .card {  padding: 10px; }
    .container {  max-width: inherit; }
    /* Mobile tab view */
    .Bnav-header {
        display: inherit;
        min-height: 33px
    }
        .Bnav-header .member-txt {font-size: 16px }
        .Bnav-header .tab { font-size: 0.8rem; }
        .Bnav-header .pipe {  line-height: 28px; }
        .Bnav-header .tab button {   padding: 3px 3px 3px 3px;}
    /* End Mobile tab view */
    .card {padding:10px!important;}
    .cal-box .btn-info, .notif-list li, .notif-list1 li { font-size: 12px }
    .cal-box { margin-top: 0px;}
    .top-head h1 { font-size: 16px !important; }
    main { }
    .setcontiner, .rewar-inp { font-size: 13px; }
    .navbar .navbar-right {        flex-basis: inherit;    }
    .set-genelogy { overflow: scroll; width: 100%;}
    ul.tree-left-tab li a { font-size: 12px; }
    ul.tree-left-tab li{margin-right:3px;}
    .top-head .btn-primary {    font-size: 10px;}
    .drop-width {  min-width: 310px;}
    .drop-mblog { font-size: 12px!important;}
    .nav-tabs .nav-item{}
    .tableFixHead{margin-bottom:10px;}
    .gr-arrow span { margin: -7px;    }
    .rl-arrow span {        margin: -8px;    }
}

@media (max-width:600px) {
 .panel .dropdown-menu {
        margin-left: -47px!important;
        font-size: .7rem;
    }

    .card .pagination {
        margin: 0 35px 0;
        padding: 0;
    }
    .container {
        max-width: 100%;
    }
    /* Mobile tab view */
    .Bnav-header {
        display: inherit;
        min-height: 33px
    }

        .Bnav-header h1.member-txt {
            float: left;
        }

        .Bnav-header .tab {
            font-size: 0.8rem;
        }

        .Bnav-header .pipe {
            line-height: 28px;
        }

    /*img.imge-new {
        width: auto!important;
    }*/
    .box-formt {
        width: 130px !important;
        display: inline-block !important;
    }

    .box-formt1 {
        width: 138px !important;
        display: inline-block !important;
    }

    .new-menu-header {
        border-radius: 0px;
    }

        .new-menu-header ul li {
            padding: 5px;
        }
}
@media (max-width:570px) {

    .member-mob {
        width: 100%;
        left: -7%!important;
    }

    .achie-mob {
        width: 100%;
        left: -7%!important;
    }
}


@media (max-width: 400px) {

    .dropdown-menu {
        padding: 0px;
        font-size: .7rem;
    }
}



@media (max-width:767px) {
    main {
        margin: 0px;
    }

    .container {
        max-width: 100%;
    }

    ul.pagination {
        flex-wrap: wrap;
    }
        ul.pagination li {
            margin-bottom: 10px;
        }

    .marqp-wrp {
        width: calc(100% - 55%);
    }
	
.set-currentwrp {
    border-radius: 0px;
    width: 100%;
    position: relative;
}
	   .target-currentwrp {
        border-radius: 0px;
        position: inherit;
        width: 100%;
    }
	

   
}

@media (max-width:362px) {

    .top-new-wrp .fnt-size
    {

        font-size: 10px!important;
    }

}

@media (max-width:343px) {

    #imagePreview {
        width: 228px!important;
    }
}
@media (max-width:767px) {
    .banking-wrp {
        width: 100%;
    }
    }
@media (max-width:400px) {
    .drop-mblog {
        padding: 20px!important;
      
    }

    #imagePreview {
         
    }

    .img-formt1 input#file1 {
        width: 260px;
        text-overflow: ellipsis;
        overflow: hidden;
        position: relative;
    }
    .img-formt1 input#file11 {
        width: 260px;
        text-overflow: ellipsis;
        overflow: hidden;
        position: relative;
    }

    .img-formt1 input#Idimage {
        width: 260px;
        text-overflow: ellipsis;
        overflow: hidden;
        position: relative;
    }

    .img-formt1 input#Idimageback {
        width: 260px;
        text-overflow: ellipsis;
        overflow: hidden;
        position: relative;
    }
}

@media (max-width:1200px) {
#slideout_inner
	{
		    top: 52%!important;
	}
	#slideout {
   
    top: 52%!important;
	}
	#QR-slideout_inner {
    position: fixed;
    top: 20%!important;
	}
	#QR-slideout {
    position: fixed;
    top: 20%!important;
	}
}
@media (max-width:700px) {
	
	 .time-container {
           
            margin-left: -1px!important;
            vertical-align: middle;
            margin-top: 0px!important;
        }



    .in-process {
        margin-top: 5px;
        padding: 6px 19px;
    }

	
}


@media (min-width: 340px) and (max-width: 1357px)
{
.hv-wrapper {
    overflow: auto;
}
	.set-genelogy {
    width: 101%;
}
}


@media (min-width: 768px) and (max-width: 1040px) {
.set-genelogy .set-currentwrp {
   margin: auto!important;
  position: relative!important;
	
    width: 64%!important;
   
}
.target-genelogy .target-currentwrp {
   position: relative!important;
   margin: auto!important;
	top: 0px!important;
   
}
	
}

@media (min-width: 340px) and (max-width: 1500px)
{
.set-genelogy .hv-wrapper .hv-item .hv-item-children .hv-item-child {
    padding: 0 60px;
}
}


.target-currentwrp {
   
    width: 283px!important;
}
.set-genelogy .hv-wrapper
{
	
	    display: inherit!important;
}


/*-------------------tree view arrow animation-------*/
@media only screen and (max-width: 768px) {
    .g-arrow span {
        display: block;
        width: 10px;
        height: 10px;
    }
    .r-arrow span {
        display: block;
        width: 10px;
        height: 10px;
    }
    .gr-arrow span {
        display: block;
         
        height: 10px;
    }
    .rl-arrow span {
        display: block;
        width: 10px;
        height: 10px;
    }
    .hv-left-arrow3 {        
        top: -8%;        
    }
    .hv-right-arrow3 {      
        top: -22%;       
    }
    .hv-left-arrow2 {
        top: 1%;
    }
    .hv-wrapper {
        display: flex;
    }
   
}
@media only screen and (max-width: 1300px) {
    .hv-wrapper {
        display: flex;
    }
    
}