@media (max-width: 414px){
    #map{
        height: 480px;
    }
    .maprightmain{
        top: 55px;
    }
    .btn.mapbtn{
        width: 65px;
        padding: 0.15rem;
    }
    .alldestroy{
        width: 237px;
    }
    .alldestroy>.card-body{
        padding: 1rem 0.5rem;
    }
    .destroygroupbtn img, .pciirigroupbtn img {
        width: 40px;
    }
    .alldestroy>.card-body>.overflow-auto{
        max-height: 105px;
    }
    .destroychekbox img {
        width: 40px;
    }
    .rangedraw, .delrange{
        width: 40px;
        height: 40px;
    }
    .pcicard.card, .iricard.card{
        bottom: 100px;
        left: 12px;
        max-height: 300px;
        overflow: auto;
        width: 237px;
    }
    .pcicard>.card-body,.iricard>.card-body{
        padding: 1rem 0.5rem;
    }
    .pciiributton{
        align-items: flex-end;
    }
    .destroybutton >.figure, .pciiributton>.figure {
        width: 60px;
    }
    .showpciiri{
        bottom: -42px;
        left: 0;
    }
    .showpciiri>.btn-group{
        border: 1px solid rgb(0 0 0 / 15%);
    }
    .showpciiri>.justify-content-evenly,.switchstate{
        border: 1px solid rgb(0 0 0 / 15%);
    }
    .showpciiri img{width: 66px;}
    .Calculation_results{
        flex-wrap: wrap;
        padding: 15px;
    }
    .roadscope{
        width: 115px;
    }
    #edittaggroup{
        right: 88px;
    }
    label[for=timetitle]{
        width: 50px;
    }
    label[for=nusertitle]{
        width: 40px;
    }
}
@media (max-width: 499px){
    .destroyhover>.btn-group{
        overflow: auto;
        max-width: 220px;
    }
    .destroygroupbtn>.fa-exclamation-circle {
        width: 40px;
        height: 40px;
    }
    .destroygroupbtn span{
        width: 50px;
    }
}
@media (max-width: 576px){
    .destroymenu{
        max-width: 180px;
        overflow: auto;
    }
    .logintitle h1{
        font-size: 40px;
    }
    .text-start h3{
        font-size: 16px;
    }
    .maprightmain{
        left: 13px;
    }
}
@media (max-width: 779px){
    .Create_Project,.project_file{
        max-width: inherit;
    }
    .collapsed-image-bar {
        height: 75px;
    }
    .collapse-button{
        bottom: 77px;
        width: 25px;
        padding-left: 7px;
    }
    .imagebarthumbnailcard{
        height: 60px;
    }
    .image-bar-thumbnail{
        width: 80px;
    }
    .annotator-space{
        height: 340px;
    }
    .modal{
        top:70px;
        max-height: 772px;
    }
    #count{overflow: auto;}
}
@media (max-width: 1365px){
    .annotator-controls{
        max-width: inherit;
        margin-top: 10px;
    }
}