/*********************Documents***************************/

.top-navbar{
    width: 431.71px;
height: 76.08px;
position: sticky;
bottom: 0px;
overflow: hidden;
background: #1D1E22;
display: flex;
align-items: center;
}

.top-navbar h6 a{
    font-family: 'Poppins';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 30px;

/* identical to box height */


color: #FFFFFF;
}

.document-card{
    display: flex;
   
    justify-content: space-between;
    align-items: center;
    padding: 0px 28.826px;
  
    width: 100%;
    height: 82px;
    
    
    background: rgba(29, 30, 34, 0.1);
    border-radius: 16px;
}
.document-card:hover{
    background: #fff;
    border: 2px solid #FFDC83;
        }
         .bg-orange{
        background: #FFDC9D;
        color:  #F99500;
    }
    .bg-pitch{
        background: #FFC5C5;
        color:  #C2472D;;
    }
    .bg-voilet{
        background: #CCADFF;
        color: #D84FE0;
     
    }
    .bg-green{
        background: #A0D8B3;
        color: #35804E;;
    }
    .bg-blue{
        background: #A1E0FD;
        color: #407D9A;
    }
.document-alphabet{

    width: 52.95px;
height: 52.95px;



border-radius: 142px;
display: flex;
justify-content: center;
align-items: center;
font-family: 'Poppins';
font-style: normal;
font-weight: 600;
font-size: 22.7966px;
line-height: 34px;





}
.document-left-info{
    display: flex;
    align-items: center;
    justify-content:left;
    width: 270px;
}
.document-left-info p{
    font-family: 'Poppins';
font-style: normal;
font-weight: 600;
font-size: 14px;
line-height: 21px;
/* identical to box height */

margin-bottom: 0px;
margin-left: 2%;
color: #1D1E22;
}
.document-view{
    width: 48.13px;
height: 48.13px;
display: flex;
justify-content: center;
align-items: center;

background: #DADADA;
border-radius: 142px;
}
/************************************responsive****************************************/

@media (min-width:320px) and (max-width: 380px)  { 

    .top-navbar {
        width: 100%;
        height: 76.08px;
        position: sticky;
        bottom: 0px;
        overflow: hidden;
        background: #1D1E22;
        display: flex;
        align-items: center;
    }

} 
@media (min-width:380px) and (max-width: 480px) {

    /************document*********************/
    .top-navbar {
        width: 100%;
        height: 76.08px;
        position: sticky;
        bottom: 0px;
        overflow: hidden;
        background: #1D1E22;
        display: flex;
        align-items: center;
    }
   
}

@media (min-width:480) and (max-width:600){

     /******************document***********************/
     .top-navbar {
        width: 100%;
        height: 76.08px;
        position: sticky;
        bottom: 0px;
        overflow: hidden;
        background: #1D1E22;
        display: flex;
        align-items: center;
    }
    
    
}

@media (min-width:801px)  {
    /**************************document**********************************/

    .top-navbar {
        width: 431.71px;
        height: 76.08px;
        position: sticky;
        bottom: 0px;
        overflow: hidden;
        background: #1D1E22;
        display: flex;
        align-items: center;
    }

}
@media (min-width:600px)  { 

     /*********************************************document**********************************/

    
     
}
@media (min-width:801px)  {
     /********************************document*******************/
        
}
@media (min-width:1025px) { 
        
}
@media (min-width:1281px) { 

    /*************************document*********************/
     
        
}