﻿
@font-face {
    font-family: 'tajawal-medium';
    src: url('../fonts/tajawal-medium.ttf') format('truetype');
}




:root{
    --moh:red;
}

.nav-link {
font-size:14px !important;
}
table.dataTable thead th, table.dataTable thead td, table.dataTable tfoot th, table.dataTable tfoot td {
  text-align:center !important ;
}
.dropend .dropdown-menu[data-bs-popper] {
    /*width: 100% !important;*/
}
.table td {
background-color: #c2000000 !important;
}



    /*.sticky-md-top{
    top:100px !important;
background-color:aqua !important ;
}*/
    /*th {
    position: sticky;
    z-index: 12;
    top: 51px;
    background: white;
    height: 300px;
}*/
    /*#GV tr th{
    position: sticky !important ;
    top: 200px;
    background-color: white;*/ /* يجعل الصف يظهر باللون الأبيض وكأنه يتماشى مع العناصر الثابتة الأخرى في الجزء العلوي */
    /*height:300px !important;
}*/
    /*.table th {
    position: relative !important;
    top: 0px !important;
    margin-top:500px !important;
    z-index: 1000 !important;
    height : 300px !important ;
    width: 100%;
    
}*/
    table-footer{
    background-color:darkgray !important;
}
/*.sticky-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
}*/
/*.Freezing {
    position: relative;
    top: expression(this.offsetParent.scrollTop);
    z-index: 10;
}
.fixedHeader {
    position: fixed;
    top: 0;
    background-color: #fff;*/ /* Change this to match your header background */
/*z-index: 1000;*/ /* Ensure it stays above other elements */
/*width: 100%;*/ /* Ensures the header spans the entire width */
/*}*/
/*.spaced {
    margin-left: 20px !important;
    margin-right: 20px !important;
}
*/
/*.animate__headShake {
    animation-name: headShake;
   animation-duration: 0s;
 animation-iteration-count: infinite;
   animation-timing-function: linear;
  animation-delay: 3s;
}*/
/*.scroll-text {
    animation: scroll 30s linear infinite;
position :relative
}
@keyframes scroll {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0%);
    }
}*/
/*========================================================================================================================================*/
.CardProgect {
    /*width: 100% !important;*/
    height: 60px !important;
    /*background: linear-gradient(to left, #87e0fd 0%,#53cbf1 40%,#05abe0 100%);*/
    background: linear-gradient(to left, #ffffff 0%,#f6f6f6 47%,#ededed 100%);
    align-items: center !important;
    color: #888888;
    border-radius: 10px;
    box-shadow: 0px 0px 5px #888888 !important;
    border: 1px solid #ffffff;
}
/*.hrcard {
    margin-top :-5px !important ;
    margin-bottom : -25px !important ;
    opacity :1;
}*/
.textshadow {
    text-shadow: 0px 0px 10px #575757 !important;
}
/*========================================================================================================================================*/
.news—container {
    position: fixed;
    margin-top: 10px;
    top: 0;
    left: 0;
    right: 0;
    /*box-shadow: 0 4px 8px -4px rgba(0,0,0,0.3);*/
    border-radius: 15px;
    border: solid 1px #cbd3da;
    /*background: linear-gradient(to bottom, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);*/
    background: #eeeeee;
    z-index: 200;
}
    /*.news—container .title {*/
        /*        position: absolute;*/
        /*height: 100%;
        display: flex;
        align-items: center;
        padding: 0 24px;
        color: darkslategray;
        font-weight: bold;
        z-index: 200;
    }*/
    .news—container ul {
        display: flex;
        list-style: none;
        margin: 0;
        animation: Scroll 40s infinite linear;
        }
        .news—container ul li  {
            white-space: nowrap;
            padding: 10px 100px 10px 10px !important;
            color: red;
            position: relative;
            font-weight:normal;
        }    
    .lii {
            white-space: nowrap;
            padding: 10px 100px 10px 10px !important;
            color: red;
            position: relative;
            font-weight:normal;
        }
        .news—container ul:hover {
            animation-play-state: paused;
        }
        .news—container ul li:last-child ::after {
            display: none;
        }
@keyframes Scroll {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(90%);
    }
}
/*========================================================================================================================================*/
.navbar {
    background: linear-gradient(to bottom, #ffffff 0%,#f6f6f6 47%,#ededed 100%);
    /*background: linear-gradient(to bottom, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);*/
    border-radius: 0px 0px 15px 15px !important;
    border: 1px #cbd3da solid !important;
}
.nav-item {
    font-size: 15px !important;
}
.EnglishText {
    text-align: left !important;
}
.nothr {
    margin-top: 10px !important;
    margin-bottom: 5px !important;
}
.WidthNotification {
    min-width: 250px !important;
}
.spinner-wrapper1 {
    background-color: #000 !important;
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: .8;
    /*transition :all 0.2s;*/
}
.ddm {
    margin-left: -100px !important;
    margin-top: 40px !important;
}
.spinner-border1 {
    opacity: 1;
    height: 60px;
    width: 60px;
}
a:hover {
    color: #0086ff !important;
    /*text-shadow: 0px 0px 1px #0086ff !important;*/
}
.redcolor {
    color: red !important;
}
.dropdown-item:active {
    background: lightgray;
    /*background: linear-gradient(to bottom, #129aba 0%,#6cd3eb 100%);*/
 /*   border-radius: 100px;*/
}
.dropdown-menu .nav-link:active {
    color: white !important;
}
.dropdown-menu.show {
    border-radius: 10px;
    background: #eeeeee !important ;
}
.mycheckbox input[type="checkbox"] {
    margin-left: 5px !important;
}
.myradio input[type="radio"] {
    margin-left: 5px !important;
}
.mt-20 {
    margin-top: 10px !important;
}
.body-height {
    min-height: 800px !important;
}
.footer {
    left: 0px;
    margin-bottom: 0px;
    position: relative;
    bottom: 0px !important;
    width: 100%;
}
.bottom-0 {
    bottom: 0px !important;
}
.mt-slide {
    margin-top: 5rem !important;
 
}
.mt-nav {
    margin-top: 8rem !important;
}
.mt-6 {
    margin-top: 3.5rem !important;
}
.mt-7 {
    margin-top: 3.5rem !important;
}
.mt-8 {
    margin-top: 4rem !important;
}
.mt-9 {
    margin-top: 4.5rem !important;
}
.mt-10 {
    margin-top: 5rem !important;
}
a {
    color: rgba(0,0,0,.5) !important;
    text-decoration: none;
}
.ColorNavLink {
    color: rgba(0,0,0,.5) !important;
    text-decoration: none !important;
}
table {
    border-radius: 10px !important;
    overflow: hidden;/* add this */
  
}
.margin-top {
    margin: 100px 40px 10px 100px !important;
}
body {
       font-family: 'Tajawal-Medium' !important ;
    background-color: #f8f8f8 !important;
}
.form-control:focus {
    border-color: #2152ff !important;
    box-shadow: 0 0 0 2px #aeb5e9 !important;
    position: relative;
}
.form-switch .form-check-input:checked {
    border-color: rgb(26 42 149 / 0%) !important;
    background-color: rgb(33 195 254) !important;
}
.gradientt {
    border-radius: 6px;
    border-style: solid;
    border-color: black;
    border-width: 1px;
    box-shadow: 5px 10px 6px #888888;
}
.icon {
    background-image: linear-gradient(310deg, #005be9 0%, #00d1ff 100%) !important;
}
.navbar-vertical .navbar-nav > .nav-item .nav-link.active .icon {
    /*background-image: linear-gradient(310deg, #005be9 0%, #00d1ff 100% ) !important;*/
}
.radius {
    border-radius: 0px 0px 10px 10px !important;
    background-color: #1C3879 !important;
    /*position: fixed !important;*/
    top: 0px;
    box-shadow: 5px 10px 6px #888888 !important;
}
.top {
    margin-top: 100px;
}
.MeShadow {
    box-shadow: 100px 100px 500px #000000 !important;
}
.left {
    margin-left: 100px !important;
}
.BtnExit {
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.5;
}
/*Old Style=========================================================================================================*/
input {
    background-color: rgba(0,0,0,0);
}
.loginall {
    text-align: center !important;
    margin-top: 100px !important;
    margin-bottom: 100px !important;
    position: relative;
    float: none;
    margin: 0px auto;
    width: 330px;
    animation: login 1s;
}
.login {
    text-align: center !important;
    margin: 0px auto;
    position: relative;
    background-color: #212121;
    height: 400px;
    width: 350px;
    border-radius: 30px;
    box-shadow: 0px 0px 10px gray;
}
.HrSign {
    text-decoration: underline !important;
    margin-left: -48px;
    margin-top: 11px;
    width: 180px !important;
    margin-right: 55px;
    float: right;
    height: 2px !important;
    border: 0px;
    border-radius: 20px;
    background: linear-gradient(35deg,#00cefe,#0c51c8);
    opacity: 1 !important;
}
.background_gridint_user {
    text-align: center;
    margin: auto;
    background-image: linear-gradient(35deg,#00cefe,#0c51c8);
    width: 253px !important;
    height: 38px;
    border-radius: 20px !important;
}
.txt_user {
    margin: 2px 0px 0px 1px !important;
    border-radius: 20px !important;
    width: 248px !important;
    background-color: #212121;
}
.background_gridint_user {
    text-align: center;
    margin: auto;
    background-image: linear-gradient(35deg,#00cefe,#0c51c8);
    width: 253px !important;
    height: 38px;
    border-radius: 20px !important;
}
.linkkk {
    color: #09c5e7;
    text-decoration: underline;
}
.form-control {
    display: inline;
}
.btn_login {
    background-image: linear-gradient(35deg,#00cefe,#0c51c8);
    margin: 15px 0px 0px 0px;
    border-radius: 30px;
    width: 120px;
}
.txt_password {
    margin: 2px 0px 0px 0px !important;
    border-radius: 20px !important;
    width: 248px !important;
    background-color: #212121;
}
* {
    box-sizing: border-box;
}
input:focus ~ label, input:valid ~ label, textarea:focus ~ label, textarea:valid ~ label, select:focus ~ label, select:valid ~ label {
    /*   top: -20px;
    font-size: 14px;*/
    color: #5264AE;
    transition: .25s;
}
/*===================================================================================================*/
.bg-gradient-primary {
    background-image: linear-gradient(310deg, #7928CA 0%, #FF0080 100%);
}
.bg-gradient-secondary {
    background-image: linear-gradient(310deg, #627594 0%, #A8B8D8 100%);
}
.bg-gradient-success {
    background-image: linear-gradient(310deg, #17ad37 0%, #98ec2d 100%);
}
.bg-gradient-info {
    background-image: linear-gradient(310deg, #2152ff 0%, #21d4fd 100%) !important;
}
.bg-gradient-warning {
    background-image: linear-gradient(310deg, #f53939 0%, #fbcf33 100%);
}
.bg-gradient-danger {
    background-image: linear-gradient(310deg, #ea0606 0%, #ff667c 100%);
}
.bg-gradient-light {
    background-image: linear-gradient(310deg, #CED4DA 0%, #EBEFF4 100%);
}
.bg-gradient-dark {
    background-image: linear-gradient(310deg, #141727 0%, #3A416F 100%);
}
.bg-gradient-faded-primary {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(203, 12, 159, 0.6) 0, #9b0979 100%);
}
.bg-gradient-faded-secondary {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(131, 146, 171, 0.6) 0, #657796 100%);
}
.bg-gradient-faded-success {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(130, 214, 22, 0.6) 0, #66a811 100%);
}
.bg-gradient-faded-info {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(23, 193, 232, 0.6) 0, #129aba 100%);
}
.bg-gradient-faded-warning {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(251, 207, 51, 0.6) 0, #f6c105 100%);
}
.bg-gradient-faded-danger {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(234, 6, 6, 0.6) 0, #b80505 100%);
}
.bg-gradient-faded-light {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(233, 236, 239, 0.6) 0, #cbd3da 100%);
}
.bg-gradient-faded-dark {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(52, 71, 103, 0.6) 0, #233045 100%);
}
.bg-gradient-faded-white {
    background-image: radial-gradient(370px circle at 80% 50%, rgba(255, 255, 255, 0.6) 0, #e6e6e6 100%);
}
.bg-gradient-faded-primary-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(203, 12, 159, 0.3) 0, #cb0c9f 100%);
}
.bg-gradient-faded-secondary-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(131, 146, 171, 0.3) 0, #8392AB 100%);
}
.bg-gradient-faded-success-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(130, 214, 22, 0.3) 0, #82d616 100%);
}
.bg-gradient-faded-info-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(23, 193, 232, 0.3) 0, #17c1e8 100%);
}
.bg-gradient-faded-warning-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(251, 207, 51, 0.3) 0, #fbcf33 100%);
}
.bg-gradient-faded-danger-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(234, 6, 6, 0.3) 0, #ea0606 100%);
}
.bg-gradient-faded-light-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(233, 236, 239, 0.3) 0, #e9ecef 100%);
}
.bg-gradient-faded-dark-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(52, 71, 103, 0.3) 0, #344767 100%);
}
.bg-gradient-faded-white-vertical {
    background-image: radial-gradient(200px circle at 50% 70%, rgba(255, 255, 255, 0.3) 0, #fff 100%);
}
