.das{
    /* display:flex; */
    /* justify-content: space-between;     */
    /* justify-content: center; */
    display: grid;
    grid-template-columns: auto auto auto auto;  
}
.das-3{
    /* display:flex; */
    /* justify-content: space-between;     */
    /* justify-content: center; */
    display: grid;
    grid-template-columns: auto auto auto;  
}
.das-3 .box-das,.das .box-das{
    /* padding: 10px;
    width: 300px;
    background-color: rgba(193, 193, 193,1); 
    color:#fff;
    border-radius: 10px; 
    margin: 5px;   */
    margin: 5px;
    padding:20px;
    background: rgba(213, 213, 213,.5);
    border-radius: 5px;  
    
    
}
.das-3 .box-das.active,.das .box-das.active{
    margin: 5px;
    padding:20px;
    background: rgb(20, 129, 255);
    color: #FFF;
    border-radius: 5px;  
    
    
}
.das-3 a,.das a{text-decoration: none;color:black}


.box-das>div:nth-child(1){font-size: 1.5rem; opacity: .8; font-weight:bold; }
.box-das>div:nth-child(2){font-size: 1.5rem; opacity: 1; font-weight:bold; }
html,input,textarea,select{font-size: 1.1rem !important;}
body{margin: 0;}
input:read-only{
    background-color: rgba(163, 163, 163, 0.505);
    border-radius: 5px;  
    border: .2mm solid rgba(128, 128, 128, 0.168);
    
}

.checkicon2x{
    padding:20px 5px 5px 5px  !important;
    border: 1px solid gray;
    border-radius: 5px;  
}
.checkicon2x.active{
    background-color: burlywood;
}
.w-100{width: 90% !important;}
.nav{
    background-color: lightslategray;
    position: fixed;
    top:0;
    left: 0px;    
    width: 100%;
    height: 60px;    
    display: flex;
    justify-content: space-between;
    box-shadow: 0px 0px 10px rgb(42, 42, 42);
    z-index: 1;
}
.panel{width: 85%;}
.content{
    display: flex;
   
    margin-top: 60px;  

    
}
.content .menu{
    width: 250px; 
    background-color: lightslategray; 
    height: 100vw;    
}


.menu-bar ul{
    /* display: inline-flex; */
    list-style: none ;
    color: #FFF;
    /* text-align: center; */
    padding: 0;
    
}
.menu-bar ul li {
    width: auto;
    margin: 10px;
    padding: 10px;
    
}
.menu-bar ul li:hover {
    background-color: rgb(174, 176, 177);
    
}
.menu-bar ul li a{
    text-decoration: none;
    color: #FFF;
    
}
.sub-menu-1,.sub-menu-2{display: none;transition-delay: 0s; }
.menu-bar ul li:hover .sub-menu-1{
    display: block;
    position: absolute;
    background-color: rgb(174, 176, 177);
    box-shadow: 5px 5px rgba(0, 0, 0, 0.6);
   
    margin-top:10px ;
    margin-left:50px ;
    z-index: 1;
    
    
}
.sub-menu-1 ul li:hover .sub-menu-2{
    display: block;
    position: absolute;
    background-color: rgb(146, 146, 146);
    box-shadow: 5px 5px rgba(0, 0, 0, 0.6);
    margin-top:5px ;
    margin-left:50px ;
    z-index: 1;
    
}
.menu-bar ul li:hover .sub-menu-1 ul{
    display: block;
    margin: 10px;
    transition-delay: 1s;
}

.sub-menu-1 ul li:hover .sub-menu-2 ul{
    display: block;
    margin: 10px;
    transition-delay: 1s;

}

.menu-bar ul li:hover .sub-menu-1 ul li{
   width: 150px;
   padding: 10px;
   border-bottom: 1px dotted #fff;
   background: transparent;
   border-radius: 0;
   text-align: left;
}

/*--------------------------------------------------------------------*/

.s-title{opacity: .7; font-size: 1.5rem;}
.s-container{
    width: 100%;
    padding:10px; 
    border:1px solid rgba(174, 176, 177,.5);
    display: block;

}
.frm-div{
    margin-top:10px 
    
}
.grid-3{
    display: grid;
    grid-template-columns: auto auto auto;
}
.grid-2{
    display: grid;
    grid-template-columns:auto auto;
}

.frm-fill-long{margin-top:10px; width: 70%;}

.sub-container{
    width: 100%;
    border:1px solid rgba(174, 176, 177,.5);
}
select.frm-fill{width: 200px;}

table, td, th {
    border: 1px solid rgba(174, 176, 177,1);    
  }
#tbl_car,#tbl_alert,#tbl_alert, table {
    border-collapse: collapse;
}
#tbl_alert table {width:99%;outline: none;border-collapse:none}

#tbl_car thead{color:rgb(95, 95, 95)}

.btn-warning{
    margin-top: 2px;
    padding: 3px;
    border-radius: 2px;
    border: none;
    background-color:rgb(255, 234, 139) !important;
}
.txt-info{color:rgb(8, 129, 172) !important;}
.txt-warning{color:rgb(255, 187, 0) !important;}
.txt-success{color:rgb(8, 153, 59) !important;}
.txt-danger{color:rgb(255, 97, 97) !important;}
.txt-dark{color:rgb(56, 56, 56) !important;}
.txt-primary{color:rgb(62, 60, 232) !important;}

.txt-bold{font-weight: bolder !important;}
.btn-primary{
    margin-top: 2px;
    padding: 3px;
    border-radius: 2px;
    border: none;
    background-color:rgb(139, 193, 255) !important;
   
}
.btn-danger{
    margin-top: 2px;
    padding: 3px;
    border-radius: 2px;
    border: none;
    background-color:rgb(255, 139, 139) !important;
    /* color:#FFF; */
}
.btn-info{
    margin-top: 2px;    
    border-radius: 2px;
   
    background-color:rgb(156, 202, 255)!important;
}
button,.btn{
    cursor: pointer;
    border: none;
    padding: 3px;
    box-shadow: 1px 1px 3px rgb(118, 118, 118);
    background-color: rgba(146, 146, 146, 0.381);
}
.btn:hover{
    cursor: pointer;
    font-weight: bold;
}
.error_frm{
    border-radius: 5px;  
    border: 2px solid red !important;    
}

.div_scoll{
    overflow-y: scroll;
    height: 300px;    
}
  /* width */
  .div_scoll::-webkit-scrollbar {
    width: 5px;
  }
  
  /* Track */
  .div_scoll::-webkit-scrollbar-track {
    background: #f1f1f1; 
  }
   
  /* Handle */
  .div_scoll::-webkit-scrollbar-thumb {
    background: #888; 
  }
  
  /* Handle on hover */
  .div_scoll::-webkit-scrollbar-thumb:hover {
    background: #555; 
  }

  .bg-warning{background: rgba(254, 228, 148, 0.685) !important;}
  .bg-success{background: rgba(173, 241, 105, 0.463) !important;}
  .bg-danger{background: rgb(255, 136, 136);}
  .bg-info{background: rgb(136, 237, 255,.3) !important; }
  .bg-dark{background: rgb(92, 92, 92) !important; color: #fff !important; ; }

.line-throng{text-decoration:line-through 2px solid red;color:gray}


.overflow-x{
    overflow-x:auto;
}