*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Parisine;
}
@font-face {
    font-family: 'Parisine';
    src: url('fonts/Parisine-Regular.otf');
}
body{
    height: 100vh;
    width: 100%;
    background-color: #fafafa;
}

.sidebar{
    height: 100%;
    width: 9.5%;
    background-color: #F2F2F2;
}

.logo{
    position:relative;
    padding: 10px;
    top:2%;
}
.container-1{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: #fafafa;

}

.container-style{
    margin-top:20px;
    margin-right: 0px;
    margin-left: 10%;
    width: 88%;
}

.container-1 .sign-in{
    margin: 20px 0px;
    font-size: 36px;
    text-align: left;
    color: #191919;
    display: block;
}
.container-1 .info{
    margin: 20px 0px;
    padding: 10px;
    width:400px;
    height: 60px;
    background-color:#FAFAFA;
    border-left:none;
    border-right: none;
    border-top: none;
    outline: none;
    font-size: 16px;
    letter-spacing: 0.5px;
    color: #191919;
    
}
.container-1 .btn-signin{
    margin:15px 0px;
    border: none;
    border-radius: 5px;
    width:400px;
    height: 60px;
    font-size: 20px;
    color: white;
    background-color: #EA4335;
}
.container-1 .forgot{
    position: absolute;
    bottom:0;
    right: 0;
    color: #343434;
    
}
.sign-link{
    text-decoration: none;
    color: white;
}
.content-report{
    margin-left:10%;
    margin-top: 50px;
}
.container-fluid{
    position: absolute;
    top: 0;
    left: 0;
    height: 100vh;
}
.tab-table select{
    border: none;
}
.slt-css{
    padding: 2px;
    font-size: 22px;
    outline: none;
    border: none;
    background-color: #fafafa;
}
.btn-arrow-1{
    position: absolute;
    margin-top: -55px;
    margin-left: 230px;
}

.col-8{
    height: 100vh;
    padding-left: 200px;
    padding-top: 50px;
    background-color: #fafafa ;
}
.col-report{
    padding-top: 20px;

}
.col-4{
    padding-top: 50px;
    height: 100vh;
    background-color:  #f7f7f7;
}
.profile-notify{
    padding: 0px 100px;
    float: right;
}
.profile-notify .img-side{
    border: 0;
    outline: 0;
    
}
.profile-notify  .profile-div{
   margin-top:5px ; 
   margin-left: -10px;
}
.profile-notify ul li{
    text-align: left;
} 

/* llllll */

.profile-notify-2{
    padding: 0px 100px;
    float: right;
}
.profile-notify-2 .img-side{
    border: 0;
    outline: 0;
    
}
.profile-notify-2  .profile-div{
   margin-top:5px ; 
   margin-left: -10px;
}
.profile-notify-2 ul li{
    text-align: left;
} 
.img-pro{
    padding-top: 5px;
}

.right-bar{
    margin: 100px;
  
}

.side-title{
    color:#4289B2;
    font-size: 24px;
}
.btn-small{
    color: white;
    height: 30px;
    width: 70px;
    font-size: 12px;
    border: none;
    border-radius: 5px;
    background-color: #4289B2;
    position: relative;
    margin-top: -55px;
    margin-left: 230px;
}

.in-put{
    margin:10px 10px;
    padding: 20px;
    outline: none;
    background-color: #F7F7F7;
    width: 300px;
    border-left: none;
    border-right: none;
    border-top: none;
}

.nav-new .logo{
    position: relative;
    /*padding: 30px; remove top*/
    padding: 10px;
    top:2%;
}
.nav-new{
    position: fixed;
    top: 0;
    left: 0;
    background-color: #F2F2F2;
    width:9.5%;
    height: 100%;
    font-size: 14px;
    display: flex;
    justify-content: center;
}
.nav-new h3{
    color: rgb(0, 0, 0);
    padding-top: 5px;
    font-size: 16px;
}
.nav-new ul{
    
    position: absolute;
    margin-top: 140px;
    margin-left:-20px ;
    list-style: none;
    align-items: center;
}
.nav-new li{
    opacity: 70%;
    text-align: center;
    padding: 10px 0px;
}
.nav-new li:hover{
    opacity: 100%;

}
.nav-new a{
    text-decoration: none;
}
.nav-new ul img{
    width: 38px;
    height: 38px;
    
}
.nav-new ul .man{
    padding: 0 5px;
}
ul .bottom-bar-1{
    position: absolute;
    margin-right: -25px;
    top: 3%;
    /* 4 23 43 63 83*/
    right: 0;
    width: 7px;
    height: 60px;
    background-color: white;
    border-radius: 10px;   

}
ul .bottom-bar-2{
    position: absolute;
    margin-right: -25px;
    top: 22%;
    /* 4 23 43 63 83*/
    right: 0;
    width: 7px;
    height: 60px;
    background-color: white;
    border-radius: 10px;   

}

ul .bottom-bar-3{
    position: absolute;
    margin-right: -25px;
    top: 42%;
    /* 4 23 43 63 83*/
    right: 0;
    width: 7px;
    height: 60px;
    background-color: white;
    border-radius: 10px;   

}
ul .bottom-bar-4{
    position: absolute;
    margin-right: -25px;
    top: 62%;
    /* 4 23 43 63 83*/
    right: 0;
    width: 7px;
    height: 60px;
    background-color: white;
    border-radius: 10px;   

}
ul .bottom-bar-5{
    position: absolute;
    margin-right: -25px;
    top: 82%;
    /* 4 23 43 63 83*/
    right: 0;
    width: 7px;
    height: 60px;
    background-color: white;
    border-radius: 10px;   

}

ul .bottom-bar-6{
    position: absolute;
    margin-right: -25px;
    top: 53%;
    /* 4 23 43 63 83*/
    right: 0;
    width: 7px;
    height: 60px;
    background-color: white;
    border-radius: 10px;

}

.table{
    margin-top: 10px;
    font-size: 14px;
    width: 100%;
    border-radius: 5px;
}

.thead{
    background-color: #FFD3CE ;
}
.thead td{
    color: rgb(0, 0, 0);
    padding: 15px 0px;
}
.table tr{
    height: 50px;
    text-align: center;
}
.tab-table tr{
    height: 35px;
}
.tab-table td{
    height: 35px;     
}

.btn-add{
    background-color: #ED1B24;
    color: white;
    padding: 10px 30px;
    border: none;
    border-radius: 5px;
    float: right;
    margin-left: 5px;
}
.sign-link, .sign-link:hover{
    text-decoration: none;
    color: white;
}

.search-on{
    width:100%;

}
.btn-dlt{
    border:none;
    background: transparent;
}

.btn-inside-2{
    margin-top: 40px;
    background-color: #4289B2;
    height: 60px;
    width: 200px;
    border: none;
    font-size: 20px;
    border-radius: 5px;
    color: white;
}

*:focus {
    outline: 0 !important;
}

.btn-inside{
    margin-top: 40px;
    margin-left:10px;
    background-color: #ED1B24;
    height: 60px;
    width: 230px;
    border: none;
    font-size: 20px;
    border-radius: 5px;
    color: white;
}
.modal-content{
    background-color: #F7F7F7 ;
    padding:20px;   
    align-items: center;
}
.modal-title{
    color: #4289B2;
    font-size: 24px;
}
    
.report-img{
    margin-left: 10px;
    border: 2px solid black;
    border-radius: 10px;
    width: 70%;
    height: 90%;

}
::selection {
    color: red;
    background: white;
  }
.report-img img{
    border-radius: 50px;
    width: auto;
    height: auto;

}
.btn-move{
    margin-right:55px;
}

.black-background {background-color:#ED1B24;}
.blue {color:#ffffff;}

.my-custom-scrollbar {
position: relative;
height: 600px;
overflow: auto;
}
.table-wrapper-scroll-y {
display: block;
}

.alert {
    padding: 0.5rem 0.5rem !important;
    text-align: center;
}
.pagination-page-info {
    padding: .6em;
    padding-left: 0;
    width: 40em;
    margin: .5em;
    margin-left: 0;
    font-size: 12px;
}
.pagination-page-info b {
    color: black;
    background: #4289B2;
    padding-left: 2px;
    padding: .1em .25em;
    font-size: 150%;
}


.page-link:hover {
        z-index: 2;
        color: #fff !important;
        text-decoration: none;
        background-color: #4289B2 !important;
        border-color: #4289B2
}
.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: #4289B2 !important;
    border-color: #4289B2
}

.btn-up-small{
    color: white;
    width: 20%;
    height:10%;
    background-color: #4289B2;
    border: none;
}

.custom-file-upload {
      width: 20%;
      height: 5%;
      border: 1px solid #ccc;
      cursor: pointer;
      color: white;
      background-color: #4289B2;
}


.box-new{
    background-color: #E6EAEA;
}

.text-msg{
    padding-left: 0;
    list-style: none;
}

.hr-padding{
    margin: 20px auto;
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}
.hr-style{
    border-top: 1px dashed #364f6b;
    background-color: transparent;
    width: 400px;
}
.small-time{
    color: #535353;
    font-size: 12px;
}
.messages{
    padding-top: 10px ;
}
.replay{
    background-color: #CFD8DC;
    width: 100%;
    padding: 0px 20px;
    margin-left: auto;
    padding: 10px 15px;
    height: fit-content;
}
.sent{
    background: #F7F8F9;
    width: 100%;
    padding:0px 20px;
    border-radius: 5px;
    padding: 10px 15px;
    height: fit-content;
}
.sent p{
    margin: auto;
}
.replay p{
    margin: auto;
}
.box-new .footing{
    background-color:#E6EAEA;
    padding: 10px;
    position: fixed;
    width: 81%;
    bottom: 70px;
}

.col-10{
    margin-left: 20px;
}

.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
    background-color: #ED1B24 !important;
}

.nav-new li.glow{
    opacity: 100%;
}

.slt-css {
    padding: 2px;
    font-size: 12px;
}

.scroller{
    overflow-y: auto;
    height: 500px;
}

.adduserscroller{
    overflow-y: auto;
    max-height: 350px
}

tr.colored th{
    background-color: #FFD3CE;
    padding-top:15px;
    color: black;
}

th{
    background-color: white ;
    position: sticky;
    top: 0;
}

.scroller-feedback{
    overflow-y: auto;
    height: 380px;
}

.card-body{
    padding: 0.55rem !important;
}

.row-add{
    position: relative !important;
    top: 7px !important;
}

.alert-dismissible .close {
    padding: 0.5rem 0.5rem !important;
}

.table > :not(caption) > * > * {
    padding: .75rem .5rem;
}

.viewrow{
    padding-bottom: calc(var(--bs-gutter-x)/ 2);
}