.dataTables_filter {
  /* text-align: end !important; */
  z-index: 1111;
}


@media only screen and (min-width: 800px) {
.pagination-container{
  display: flex !important;
  justify-content: space-between !important ;
}
}

.dt-buttons>button{
  border-color: #166155 !important;
  background-color: #166155 !important;
  color: #FFFFFF !important;
  padding: 7px !important;
}

/* .content-body{
  margin-top: 30px !important;
} */

/* .content-wrapper{
  margin-top: 30px !important;

} */

.app-content.content{
  margin-top: 30px !important;

}


.icon_emergency{
  
  width: 25px;
  padding-bottom: 4px;
  height: 28px;

}
.ql-snow{
  /* height: 50px !important; */
  /* z-index: 12121; */
}


.select2-governorate-results{
  /* z-index: 11112 !important; */

}
.ql-expanded{
  z-index: 13;
}

.select-container{
  z-index: 14 !important;

}



.editor.ql-snow{
  height: 150px !important;
  z-index: 11;


}

.datatables-basic{
  display: inline-table!important;
}

/* when table is empty hAS to be table displayed */

.font-size-large{
  font-size: large;
}

.font-size-larger{
font-size: larger;
}

.font-weight-500{
font-weight: 500;
}

.tasks{
  position: fixed;
  bottom: 3px;
  z-index: 999;
  left: 7vw ;
}


/* The Modal (background) */
.dialogHover {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 9999; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.dialogHover-content {
  background-color: #fefefe;
  margin: 15% auto;
  border: 1px solid #888;
  width: 51%;
  border-radius: 9px;
}


/* The Close Button */
.closeButtonOfDialog {  
  cursor: pointer;
  color: #aaa;
  text-align: right;
  font-size: 28px;
  font-weight: bold;
}

.closeButtonOfDialog:hover,
.closeButtonOfDialog:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}


.mainElement {
  border: 1px solid gray;
  border-radius: 5px;
  height: 135px;
  padding: 0px;
}
@media (max-width: 1675.98px){
div.dataTables_wrapper {
  overflow: scroll;
}
}


.whitefont{
  color: white;
}
.is_approved_2{
  background-color: aliceblue;
 }


 .is_approved_1{
  background-color: rgb(138, 235, 41);
 }

 .is_approved_0{
  background-color: rgb(249, 89, 53);
 }


 .user-chats::-webkit-scrollbar,.chat-user-list-wrapper::-webkit-scrollbar {
  width: 0.5em;
}
 
.user-chats::-webkit-scrollbar-track,.chat-user-list-wrapper::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 100px;
}
 
.user-chats::-webkit-scrollbar-thumb,.chat-user-list-wrapper::-webkit-scrollbar-thumb {
  background-color: rgb(209, 206, 206);
  outline: 1px solid slategrey;
  border-radius: 100px;
}

.p1 {
  background-color: rgb(209, 207, 207);
  float: right;
  padding: 0.2rem 0.5rem;
  border-radius: 5px;
  border-style: solid;
  border-width: 1px;
  border-color: gray;
  font-size: 17px;
  font-weight: 700;
  box-shadow: 3px 1px 1px 0px grey;
}

.p2 {
  border-bottom: 1px gray !important;
  float: right;
  margin-right: 0.5rem;
  font-weight: 900;
  font-size: 0.9rem;
  padding: 0.2rem;
}

.main_title{
  color: aliceblue;
}








#loading{
  position: fixed;
    width: 100%;
    height: 100%;
    text-align: center;
    background: #ffffff91;
    z-index: 9999;
}

 
  
  /* Safari */
  @-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }

  




  


#loaderMain {
  position: relative;
  width: 100%;
  height: 100%;
  right: 50%;
  top: 34%;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-perspective: 600;
  -moz-perspective: 600;
  perspective: 600;
}
#loaderMain span {
  display: block;
  position: absolute;
  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
}
#loaderMain span:after {
  display: block;
  content: "";
  border-style: solid;
  border-color: transparent;
  border-width: 100px 58px 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
#loaderMain span:nth-child(1) {
  -webkit-transform: rotate3d(0, 0, 1, 90deg);
  -moz-transform: rotate3d(0, 0, 1, 90deg);
  -ms-transform: rotate3d(0, 0, 1, 90deg);
  -o-transform: rotate3d(0, 0, 1, 90deg);
  transform: rotate3d(0, 0, 1, 90deg);
}
#loaderMain span:nth-child(1):after {
  border-top-color: #19487e;
  -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  -ms-transform: rotate3d(0.5, 1, 0, 180deg);
  -o-transform: rotate3d(0.5, 1, 0, 180deg);
  transform: rotate3d(0.5, 1, 0, 180deg);
  -webkit-animation: split 2s 0.1111111111s ease infinite;
  -moz-animation: split 2s 0.1111111111s ease infinite;
  animation: split 2s 0.1111111111s ease infinite;
}
#loaderMain span:nth-child(2) {
  -webkit-transform: rotate3d(0, 0, 1, 150deg);
  -moz-transform: rotate3d(0, 0, 1, 150deg);
  -ms-transform: rotate3d(0, 0, 1, 150deg);
  -o-transform: rotate3d(0, 0, 1, 150deg);
  transform: rotate3d(0, 0, 1, 150deg);
}
#loaderMain span:nth-child(2):after {
  border-top-color: #0d4789;
  -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  -ms-transform: rotate3d(0.5, 1, 0, 180deg);
  -o-transform: rotate3d(0.5, 1, 0, 180deg);
  transform: rotate3d(0.5, 1, 0, 180deg);
  -webkit-animation: split 2s 0.2222222222s ease infinite;
  -moz-animation: split 2s 0.2222222222s ease infinite;
  animation: split 2s 0.2222222222s ease infinite;
}
#loaderMain span:nth-child(3) {
  -webkit-transform: rotate3d(0, 0, 1, 210deg);
  -moz-transform: rotate3d(0, 0, 1, 210deg);
  -ms-transform: rotate3d(0, 0, 1, 210deg);
  -o-transform: rotate3d(0, 0, 1, 210deg);
  transform: rotate3d(0, 0, 1, 210deg);
}
#loaderMain span:nth-child(3):after {
  border-top-color: rgb(82, 132, 206);
  -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  -ms-transform: rotate3d(0.5, 1, 0, 180deg);
  -o-transform: rotate3d(0.5, 1, 0, 180deg);
  transform: rotate3d(0.5, 1, 0, 180deg);
  -webkit-animation: split 2s 0.3333333333s ease infinite;
  -moz-animation: split 2s 0.3333333333s ease infinite;
  animation: split 2s 0.3333333333s ease infinite;
}
#loaderMain span:nth-child(4) {
  -webkit-transform: rotate3d(0, 0, 1, 270deg);
  -moz-transform: rotate3d(0, 0, 1, 270deg);
  -ms-transform: rotate3d(0, 0, 1, 270deg);
  -o-transform: rotate3d(0, 0, 1, 270deg);
  transform: rotate3d(0, 0, 1, 270deg);
}
#loaderMain span:nth-child(4):after {
  border-top-color: #4363a7;
  -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  -ms-transform: rotate3d(0.5, 1, 0, 180deg);
  -o-transform: rotate3d(0.5, 1, 0, 180deg);
  transform: rotate3d(0.5, 1, 0, 180deg);
  -webkit-animation: split 2s 0.4444444444s ease infinite;
  -moz-animation: split 2s 0.4444444444s ease infinite;
  animation: split 2s 0.4444444444s ease infinite;
}
#loaderMain span:nth-child(5) {
  -webkit-transform: rotate3d(0, 0, 1, 330deg);
  -moz-transform: rotate3d(0, 0, 1, 330deg);
  -ms-transform: rotate3d(0, 0, 1, 330deg);
  -o-transform: rotate3d(0, 0, 1, 330deg);
  transform: rotate3d(0, 0, 1, 330deg);
}
#loaderMain span:nth-child(5):after {
  border-top-color: #3379ca;
  -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  -ms-transform: rotate3d(0.5, 1, 0, 180deg);
  -o-transform: rotate3d(0.5, 1, 0, 180deg);
  transform: rotate3d(0.5, 1, 0, 180deg);
  -webkit-animation: split 2s 0.5555555556s ease infinite;
  -moz-animation: split 2s 0.5555555556s ease infinite;
  animation: split 2s 0.5555555556s ease infinite;
}
#loaderMain span:nth-child(6) {
  -webkit-transform: rotate3d(0, 0, 1, 390deg);
  -moz-transform: rotate3d(0, 0, 1, 390deg);
  -ms-transform: rotate3d(0, 0, 1, 390deg);
  -o-transform: rotate3d(0, 0, 1, 390deg);
  transform: rotate3d(0, 0, 1, 390deg);
}
#loaderMain span:nth-child(6):after {
  border-top-color: #406c9f;
  -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  -ms-transform: rotate3d(0.5, 1, 0, 180deg);
  -o-transform: rotate3d(0.5, 1, 0, 180deg);
  transform: rotate3d(0.5, 1, 0, 180deg);
  -webkit-animation: split 2s 0.6666666667s ease infinite;
  -moz-animation: split 2s 0.6666666667s ease infinite;
  animation: split 2s 0.6666666667s ease infinite;
}

@-webkit-keyframes split {
  0% {
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  }
  25% {
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: rotate3d(0, 1, 0, 360deg);
  }
  50% {
    opacity: 1;
    -webkit-transform-origin: 100% 0%;
    -webkit-transform: rotate3d(0, 1, 0, 360deg);
  }
  75% {
    opacity: 0;
    -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
  }
}
@-moz-keyframes split {
  0% {
    -moz-transform-origin: 50% 100%;
    -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  }
  25% {
    -moz-transform-origin: 50% 100%;
    -moz-transform: rotate3d(0, 1, 0, 360deg);
  }
  50% {
    opacity: 1;
    -moz-transform-origin: 100% 0%;
    -moz-transform: rotate3d(0, 1, 0, 360deg);
  }
  75% {
    opacity: 0;
    -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  }
  100% {
    opacity: 1;
    -moz-transform: rotate3d(0.5, 1, 0, 180deg);
  }
}
@keyframes split {
  0% {
    -webkit-transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    -o-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
    -moz-transform: rotate3d(0.5, 1, 0, 180deg);
    -ms-transform: rotate3d(0.5, 1, 0, 180deg);
    -o-transform: rotate3d(0.5, 1, 0, 180deg);
    transform: rotate3d(0.5, 1, 0, 180deg);
  }
  25% {
    -webkit-transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    -o-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transform: rotate3d(0, 1, 0, 360deg);
    -moz-transform: rotate3d(0, 1, 0, 360deg);
    -ms-transform: rotate3d(0, 1, 0, 360deg);
    -o-transform: rotate3d(0, 1, 0, 360deg);
    transform: rotate3d(0, 1, 0, 360deg);
  }
  50% {
    opacity: 1;
    -webkit-transform-origin: 100% 0%;
    -moz-transform-origin: 100% 0%;
    -ms-transform-origin: 100% 0%;
    -o-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-transform: rotate3d(0, 1, 0, 360deg);
    -moz-transform: rotate3d(0, 1, 0, 360deg);
    -ms-transform: rotate3d(0, 1, 0, 360deg);
    -o-transform: rotate3d(0, 1, 0, 360deg);
    transform: rotate3d(0, 1, 0, 360deg);
  }
  75% {
    opacity: 0;
    -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
    -moz-transform: rotate3d(0.5, 1, 0, 180deg);
    -ms-transform: rotate3d(0.5, 1, 0, 180deg);
    -o-transform: rotate3d(0.5, 1, 0, 180deg);
    transform: rotate3d(0.5, 1, 0, 180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate3d(0.5, 1, 0, 180deg);
    -moz-transform: rotate3d(0.5, 1, 0, 180deg);
    -ms-transform: rotate3d(0.5, 1, 0, 180deg);
    -o-transform: rotate3d(0.5, 1, 0, 180deg);
    transform: rotate3d(0.5, 1, 0, 180deg);
  }
}




body::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  background-color: #F5F5F5;
}

body::-webkit-scrollbar {
  width: 6px;
  background-color: #A7C6A8;
}

body::-webkit-scrollbar-thumb {
  border-radius: 4px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
  background-color: #A7C6A8;
}