*{
    margin: 0 ;
    padding: 0 ;
    box-sizing: border-box;
    margin-right: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

#view_class_section a{
text-decoration: none;
}

   .link-me{
    text-decoration: none;
    padding: 1px;
    font-weight: 500;
    font-size: 99%;
   }  .link-me:hover{
    text-decoration: underline;
   }

::selection{
    background-color: #043F2E;
    color: white;
  }

  .active-class, .status-class:hover{
    border-bottom: 3px solid rgb(13,110,253);
  }

  .active-section, .status-section:hover{
    border-bottom: 3px solid rgb(13,110,253);
  }
  .active-day:hover, input[name='day_name']:checked{
    border-bottom: 3px solid rgb(13,110,253);
  }


  .text-fill{
    width: 250px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;

}

.card-image{
    position: relative;
    height: 150px;
    width: 150px;
    border-radius: 50%;
    background: #FFF;
    padding: 3px;
}
.avatar-circle{
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid #4070F4;
}

.text-three-line{
        display: -webkit-box;
        max-width: 400px;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
       }

.bg-card-color{
        background-color: #4070F4 !important;
      }  
      
.bg-card-color-light{
        background-color: #4070f41e !important;
        
      }

  
  @media only screen and (min-width:768px){
    
    .main-content{
      position: relative; margin-left: 20% !important;
      transition: all .2s;
  
    }  
    .main-menu{
      width: 20% !important;
      
    }
    }
    
    
    @media only screen and (max-width:768px){
    .main-content{
      position: relative; margin-left: 0px !important;
    }  
    .main-menu{
      width: 100% !important;
    }
    }


    #mujibCorner{
        position: absolute; 
        background-color: rgba(236, 231, 231, 0.758); 
        right: 0; 
        width: 200px !important;
    }

    @media only screen and (max-width:768px){
        #mujibCorner{
            position: absolute; 
            background-color: rgba(236, 231, 231, 0.758); 
            right: 0; 
            width: 100px !important;
        }
    
        }
    

  #aef img {
    width: 100%;
     height: 200px;
    
}

@media only screen and (max-width: 768px){
  #aef img {
    width: 95%;
     height: 250px;
    
}
}


img {
    border-radius: 5px;
}
.responsive-card-img{
    height: 250px;
    width: 50% !important;
    border-radius: 10px;
   
}

@media only screen and (max-width: 768px) {
    .responsive-card-img{
        height: 200px;
        width: 90% !important;
        border-radius: 10px;

    }
}

/* modified css */
.view-link{
    background-color: lightcyan !important;
   padding: 5px;

}
.text-muted{
    font-weight: 400 !important;
    color: rgba(56, 58, 60, 0.942) !important
}
.tooltipx{
    position: relative;
    z-index: 1080;

}
.tooltipx:hover .tooltipy{
display: block;
}
.tooltipy{
    display: none;
    position: absolute;
    top: 45px;
    /* left: 50%; */
    right: 0%;
    /* transform: translate(-50%, -50%); */
    padding: 2px;
    /* background-color: rgba(0, 0, 0, 0.133); */
    font-weight: small;
    border-radius: 5px;
    z-index: 1080;


}


.mtx{
    margin-top: 100px !important;
}

.mbx{
    margin-bottom: 75px !important;
}


.link-hover:hover{
    text-decoration: underline !important;
   
}

.slide-navs li{
    padding: 10px;
    transform: scale(1.3);
}

.btn-hover:hover, .btn-light:hover, .btn-focus:hover{
background-color: rgba(44, 42, 42, 0.126) !important;
}



.btn-focus:focus{
    border: 3px dotted white !important; 
    background-image: linear-gradient(310deg,#2152ff,#21d4fd) !important;
    color: white;

}

.btn-active{
    border: 3px dotted white !important; 
    background-image: linear-gradient(310deg,#2152ff,#21d4fd) !important;
    color: white;

}

.link-hover:hover .link-move{
position: relative;
left: 5px;
transition: all 2s !important;
}

#header{
    background-color: #EEF2E3 !important;
}
#header ul li{
    font-size: 14px;
    font-weight: 600;
    font-family: sans-serif;
    color: #78C51C;
}

#header li a:hover {
    color: #78C51C !important;
    text-decoration: underline !important;


}

#mainMenu {
    display: none;
    background-color: #EEF2E3 !important;
    width:100%;  position: absolute !important; top:66px; z-index: 1030;
    transition: all 1s;
}

#mainMenu ul li {

    padding: 5px;
    font-weight: 500;
    


}

#mainMenu li a:hover {
    color: #78C51C;
    text-decoration: underline !important;

}



#footer ul li{
    color: white;
    list-style: none !important;
    font-size: 14px;
    font-weight: 600;
    font-family: sans-serif;
}

#footer li a:hover, #legal a:hover{
    color: #C8F169 !important;
    text-decoration: underline !important;

   
}

#legal a{
    color: white;
    list-style: none !important;
    font-size: 14px;
    font-weight: 600;
    font-family: sans-serif;
}




.toggleBtnRotate{
    transition: all 1s;
    transform: rotate(90deg) !important;
    background-color: #78C51C;

}



.bg-gradient-danger {
    background-image:repeating-linear-gradient(310deg,#ea0606,#ff667c);
}

.bg-gradient-primary {
    background-image: linear-gradient(310deg,#7928ca,#ff0080);
}

.bg-gradient-secondary {
    background-image: linear-gradient(310deg,#627594,#a8b8d8);
}

.bg-gradient-info {
    background-image: linear-gradient(310deg,#2152ff,#21d4fd);
}

.bg-gradient-success {
    background-image: linear-gradient(310deg,#17ad37,#98ec2d);
}

.bg-gradient-warning {
    background-image: linear-gradient(310deg,#f53939,#fbcf33);
}

.bg-gradient-danger {
    background-image: linear-gradient(310deg,#ea0606,#ff667c);
}

.bg-gradient-light {
    background-image: linear-gradient(310deg,#ced4da,#ebeff4);
}

.bg-gradient-dark {
    background-image: linear-gradient(310deg,#141727,#3a416f);
}

.bg-gradient-transparent {
    background-color: rgba(0, 0, 0, 0.647);
   text-decoration: none !important;
}



.bg-demo-img-color{
    background-color: #4070F4 !important;


  }

  @keyframes bg-demo-img-placeholder {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}


.page-loading-top{
    height: max-content !important;
    width: 100px !important;
    text-align: center !important;
    /* background-color: #fddc06fb !important; */
    background-color: #feefc3 !important;
    padding: 2px !important;
    position: fixed !important;
    top: 0px !important;
    left: 50% !important;
    transform: translate(-50%) !important;
    z-index: 999999 !important;
    font-weight:600;
  }


.form-self
{

 padding: 3px !important;
 width: 100% ;
 outline: none !important;

 
 
}

.form-self:focus
{
     box-shadow: 0 4px 8px 0 rgba(71, 86, 202, 0.2), 0 6px 20px 0 #281e5d !important;
      outline: 1px solid #281e5d !important;
      border: none !important;
      transition: all 300ms !important;

      
}

.btn-self
{
 color: white;
 background-color: #4043eecd ;
 padding: 5px;
 border: none;
 border-radius: 5px;
 width: 90px;
}
.btn-self:hover
{
 background-color: #5499e9;
}


.btn-dev 
{
    background-color: blueviolet !important;
    padding: 5px !important;
    color: white;
    border: none;

}

.btn-dev:hover 
{
    background-color: rgb(86, 14, 154) !important;
    padding: 5px !important;
    color: white;
    border: none;
}



  #thead
  {
      background-color:  #281e5d !important;
      color: white !important;
  }




  *, ::before, ::after{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.form-dev{
    border: 1px solid #c2e7ff;
    outline: none;
    padding: 10px;
    width: 100%;
  }
  .form-dev:focus{
    border: none;
    outline: none;
    background-color: #c2e7ff;
  }
  
.bg-go{
    background-color: #feefc3;
}
.btn-go{
    background-color: #c2e7ff;
}

.btn-go:hover{
    background-color: rgba(194, 231, 255, 0.684)
}

.shadowx{
   box-shadow:  0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.18)
}


.findcard:hover{
    transform: scale(1.05);

  }
  .findcard{
    transition: all 500ms;
  }