@font-face {
  font-family: biensport;
  src: url(../fonts/biensport.ttf) format("truetype");
}
@font-face {
  font-family: biensport_light;
  src: url(../fonts/biensport_light.ttf) format("truetype");
}
@font-face {
  font-family: biensport_bold;
  src: url(../fonts/biensport_bold.ttf) format("truetype");
}
@font-face {
  font-family: Almarai;
  src: url(../fonts/Almarai-Regular.ttf) format("truetype");
}
@font-face {
  font-family: droid;
  src: url(../fonts/DroidKufi-Regular.ttf) format("truetype");
}
@keyframes progress {
  0% {
    --percentage: 0;
  }
  100% {
    --percentage: var(--value);
  }
}
@property --percentage {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
/*$Color_H: #1bda10;*/
/*$Color_Pause: #f38e1e;*/
body {
  direction: rtl;
  font-family: Almarai;
}
body .Moshaf_Page {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
body .Moshaf_Page .Page_Img {
  /*background-color: cyan;*/
  height: calc(100vh - 210px);
  overflow: auto;
}
body .Moshaf_Page .Page_Img img {
  width: 100%;
  max-width: 500px;
  height: auto;
}
body .AppHeader {
  width: 100%;
}
body .AppHeader td {
  padding: 0;
}
body .AppHeader .AppLogo {
  /*background-color: yellow;*/
  height: 60px;
  width: 1%;
  white-space: nowrap;
}
body .AppHeader .AppLogo img {
  height: 2.7rem;
  width: auto;
  margin-left: 0.5rem;
}
body .AppHeader .AppLogo:hover {
  cursor: pointer;
}
body .AppHeader .AppName {
  /*background-color: yellow;*/
  width: 1%;
  white-space: nowrap;
  font-size: 1.7rem;
  font-family: biensport_bold;
  color: #0e4e3e;
}
body .AppHeader .AppName img {
  height: 1.7rem;
  width: auto;
}
body .AppHeader .AppName:hover {
  cursor: pointer;
}
body .AppHeader .HeaderBtn {
  /*background-color: skyblue;*/
  width: 70px;
  text-align: center;
}
body .AppHeader .HeaderBtn i {
  font-size: 2rem;
}
body .AppHeader .HeaderBtn:hover {
  cursor: pointer;
  color: Blue;
  background: #f6f9ff;
}
body .AppHeader .HeaderBtn:hover a {
  color: blue;
}
body .AppHeader .HeaderBtn a {
  /*background-color: yellow !important;*/
  display: inline-block;
  width: 100%;
  height: 60px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  color: black;
}
body .AppHeader .HeaderBtn .dropdown-menu:hover {
  cursor: default;
}
body .AppHeader .ExitBtn {
  /*background-color: yellow;*/
}
body .AppHeader .BorderTD {
  /*background-color: yellow;*/
  width: 1.5rem;
}
body .AppMenu {
  width: 250px;
  max-width: 90vw;
  max-height: 70vh;
  overflow: auto;
}
body .AppMenu table td {
  height: 40px;
  padding-left: 0px;
  /*background-color:cyan;*/
}
body .AppMenu table .AM_Item:hover {
  cursor: pointer;
  color: blue;
  background-color: #f2f9ff;
}
body .AppMenu table .AM_Icon {
  padding: 0 10px 0 15px;
}
body .AppMenu table .AM_Icon i {
  font-size: 1.5rem;
}
body .AppMenu table .AM_Label {
  font-size: 1.2rem;
  font-size: 1rem;
  width: 250px;
  max-width: 90vw;
  text-align: right;
  /*background-color: yellow;*/
}
body .AppMenu table .Menu_Sep td {
  height: 20px;
}
body .AppMenu table .Menu_Sep hr {
  color: #b4b4b4;
  height: 0.2px;
  margin: 10px;
}
body .AppMenu table .UserMenu_Header {
  /*background-color: yellow;*/
  text-align: center;
}
body .AppMenu table .UserMenu_Header p {
  margin: 0;
  font-weight: 600;
  margin-bottom: 5px;
}
body .AppMenu table .UserMenu_Header span {
  /*font-size: 0.9rem;*/
  display: block;
}
body .AppMenu table .UserMenu_Header:hover {
  cursor: default;
}
body .AppMenu table .UserMenu_Exit {
  /*color: darkred; */
}
body .AppMenu table .UserMenu_Exit:hover {
  color: #bc2424;
  background-color: #fff8f8;
}
body .UserIcon {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  padding: 0.5rem 0;
}
body .UserIcon div {
  border-radius: 50%;
  width: 4rem;
  height: 4rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
body .UserIcon div span {
  font-size: 2.5rem;
  font-weight: 700;
  font-family: Arial;
}
body .Css_M1 {
  background-color: #e6ecfa;
  color: #0f26ad;
}
body .Css_W1 {
  background-color: #fbe7fc;
  color: #b40dbc;
}
body .Selected_MenuItem {
  color: #0025d0;
  /*font-weight: 600;*/
}
body .form-control:focus, body .form-select:focus, body .form-check-input:focus {
  box-shadow: none;
}
body .form-switch .form-check-input:hover, body .form-switch label:hover {
  cursor: pointer;
}
body select {
  font-family: droid;
  /*font-family: Almarai;*/
  /*font-family: biensport;*/
}
body h1, body h2, body h3, body h4, body h5, body h6, body span, body p {
  font-family: Almarai;
}
body a {
  text-decoration: none;
}
body .AR {
  font-family: Almarai !important;
}
body .HCursor:hover {
  cursor: pointer;
}
body .WaitingDiv {
  display: none;
  position: absolute;
  top: 200px;
  left: calc(50vw - 20px);
  width: 40px;
  height: 40px;
  color: #0B610B;
  z-index: 9000;
}
body .FormWaitingDiv {
  display: none;
  position: absolute;
  top: 200px;
  left: calc(50% - 20px);
  width: 40px;
  height: 40px;
  color: #0B610B;
  z-index: 9000;
}
body span_mnd:before {
  content: "";
}
body span_mnd:after {
  content: " *";
  color: red;
  /*font-weight: bold;  :before */
}
body .Gradient_AdmReg {
  background: #b6f0e2;
  background: linear-gradient(302deg, rgb(182, 230, 240) 0%, rgb(255, 255, 255) 70%);
}
body .Gradient_1 {
  background: #d7f5e9;
  background: linear-gradient(300deg, rgb(215, 245, 233) 0%, rgb(255, 255, 255) 76%);
}
body .Gradient_2 {
  background: #d7eaf5;
  background: linear-gradient(300deg, rgb(215, 234, 245) 0%, rgb(255, 255, 255) 76%);
}
body .Gradient_3 {
  background: #e5d7f5;
  background: linear-gradient(300deg, rgb(229, 215, 245) 0%, rgb(255, 255, 255) 76%);
}
body .Gradient_4 {
  background: #f0f5d7;
  background: linear-gradient(300deg, rgb(240, 245, 215) 0%, rgb(255, 255, 255) 76%);
}
body .Gradient_OK {
  background: #abf7ed;
  background: linear-gradient(350deg, rgb(171, 247, 237) 0%, rgb(255, 255, 255) 75%);
}
body .Color_H {
  color: #00d200;
}
body .Color_T {
  color: #00d0d2;
}
body .Color_M {
  color: #0900d2;
}
body .BColor_H {
  background-color: #00d200;
}
body .BColor_T {
  background-color: #00d0d2;
}
body .BColor_M {
  background-color: #0900d2;
  color: white;
}
body .RegStatus_1 i {
  color: #42eb42;
}
body .RegStatus_2 i {
  color: orange;
}
body .Card_LabVal {
  width: 100%;
}
body .Card_LabVal td {
  height: 35px;
}
body .Card_LabVal td i {
  font-size: 1.4rem;
}
body .Card_LabVal .Lab_Cell {
  width: 120px;
  /*font-weight: bold;*/
  color: darkblue;
}
body .Card_LabVal .Btn_Cell {
  /*background-color: yellow;*/
  width: 50px;
  text-align: center;
  border-radius: 5px;
}
body .Card_LabVal .Btn_Cell:hover {
  background-color: #f8fafd;
  cursor: pointer;
  color: blue;
}
body .Card_LabVal .Btn_Cell:active {
  font-size: 1.35rem;
  background-color: #f1f5f9;
}
body .CircularProgressBar [role=progressbar] {
  --percentage: var(--value);
  --primary: #0013b7;
  --secondary: #adf;
  --size: 120px;
  animation: progress 2s 0.5s forwards;
  /*animation: progress 2s 0.5s forwards;*/
  width: var(--size);
  aspect-ratio: 1;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
}
body .CircularProgressBar [role=progressbar]::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: conic-gradient(var(--primary) calc(var(--percentage) * 1%), var(--secondary) 0);
  mask: radial-gradient(white 55%, transparent 0);
  mask-mode: alpha;
  -webkit-mask: radial-gradient(rgba(0, 0, 0, 0) 55%, #000 0);
  /*-webkit-mask-mode: alpha;*/
}
body .CircularProgressBar [role=progressbar]::after {
  counter-reset: percentage var(--value);
  content: counter(percentage) "%";
  font-family: Helvetica, Arial, sans-serif;
  font-size: calc(var(--size) / 5);
  color: var(--primary);
  font-weight: 800;
}
body .Div_GradeRating {
  overflow: hidden;
  /*background-color:yellow;*/
}
body .Div_GradeRating div {
  overflow: hidden !important;
  height: 130px !important;
}
body .Flex_Row_Center {
  /*background-color: cyan;*/
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
body .Info_Notif {
  background-color: red;
  color: white;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 0.9rem;
  font-family: Arial;
  position: relative;
  margin-right: 5px;
  top: -7px;
}
body .WrdStatus_0 i {
  color: #a3a7ab;
}
body .WrdStatus_1 i {
  color: #21c821;
}
body .WrdStatus_2 i {
  color: orange;
}
body .WrdStatus_3 i {
  color: orangered;
}
body .WrdStatus_4 i {
  color: #17a8a2;
}

.WebSite .AppName {
  font-family: biensport_bold;
  /*font-size: 2rem !important;*/
  color: #0e4e3e;
}
.WebSite h1, .WebSite h2, .WebSite h3, .WebSite h4, .WebSite h5, .WebSite h6, .WebSite span, .WebSite p {
  /*line-height: 2;*/
}
.WebSite h4 {
  line-height: 2;
}
.WebSite .navbar a {
  font-size: 1.2rem !important;
}
.WebSite .navbar a:hover {
  color: #004dde;
}
.WebSite .navbar li:hover {
  color: #004dde;
}
.WebSite .navbar .active {
  color: #004dde;
}
.WebSite .section-title {
  text-align: center;
  padding-bottom: 1.5rem;
  color: #070d59;
  color: #0e4e3e;
}
.WebSite .section-title h2 {
  /*font-size: 32px;*/
  font-weight: bold;
  text-transform: uppercase;
  position: relative;
  /*color: #222222;*/
}
.WebSite .section-title h2:before, .WebSite .section-title h2:after {
  content: "";
  width: 50px;
  height: 8px;
  background: #0e4e3e;
  display: inline-block;
  margin: 0px 10px;
  border-radius: 4px;
}
.WebSite .section-title p {
  margin: 15px 0 0 0;
}
.WebSite .salet {
  /*background-color: lime;*/
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.WebSite .salet img {
  width: 30vw;
  height: auto;
  min-width: 300px;
}
.WebSite .count-box {
  padding: 20px 0;
  width: 100%;
}
.WebSite .count-box i {
  font-size: 36px;
  color: #3498db;
  margin-left: 10px;
}
.WebSite .count-box span {
  font-family: Arial;
  font-size: 36px;
  line-height: 30px;
  /*display: block;*/
  font-weight: 700;
  color: #222222;
  margin-left: 50px;
}
.WebSite .count-box p {
  font-family: Almarai;
  padding: 15px 0 0 0;
  margin: 0 0 0 50px;
  /*font-family: "Raleway", sans-serif;*/
  font-size: 1.5rem;
  color: #484848;
}
.WebSite .Sep01 {
  width: 50px;
  height: 8px;
  background: #0e4e3e;
  display: inline-block;
  margin: 0px 10px;
  border-radius: 4px;
}
.WebSite .more-services {
  padding-top: 20px;
}
.WebSite .more-services .card {
  border: 0;
  padding: 160px 20px 20px 20px;
  position: relative;
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.WebSite .more-services .card .card-body {
  z-index: 10;
  background: rgba(255, 255, 255, 0.9);
  padding: 15px 30px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  transition: 0.3s;
  transition: ease-in-out 0.4s;
  border-radius: 5px;
}
.WebSite .more-services .card .card-body .card-title {
  font-weight: 700;
  text-align: center;
  margin-bottom: 15px;
}
.WebSite .more-services .card .card-body .card-title a {
  color: #222222;
}
.WebSite .more-services .card .card-body .card-text {
  color: #5e5e5e;
}
.WebSite .more-services .card:hover .card-body {
  background: #137773;
}
.WebSite .more-services .card:hover .card-title, .WebSite .more-services .card:hover .card-text, .WebSite .more-services .card:hover h5 {
  color: #fff;
}
.WebSite .more-services .BackImg2 {
  background-image: url(../img/img02.jpg);
}
.WebSite .more-services .BackImg3 {
  background-image: url(../img/img03.jpg);
}
.WebSite .more-services .BackImg4 {
  background-image: url(../img/img04.webp);
}
.WebSite .more-services .BackImg5 {
  background-image: url(../img/img05.webp);
}
.WebSite .services {
  /*


  */
}
.WebSite .services a {
  color: black;
}
.WebSite .services .icon-box {
  padding: 30px;
  position: relative;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 0 29px 0 rgba(68, 88, 144, 0.12);
  transition: all 0.3s ease-in-out;
  border-radius: 8px;
  z-index: 1;
}
.WebSite .services .icon-box::before {
  content: "";
  position: absolute;
  background: #e0f3ed;
  right: -60px;
  top: -40px;
  width: 100px;
  height: 100px;
  border-radius: 50px;
  transition: all 0.3s;
  z-index: -1;
}
.WebSite .services .icon-box:hover::before {
  /*background: #3498db;*/
  background: #339696;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0px;
}
.WebSite .services .icon {
  margin: 0 auto 20px auto;
  padding-top: 10px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  background: #339696;
  transition: all 0.3s ease-in-out;
}
.WebSite .services .icon i {
  font-size: 36px;
  line-height: 1;
  color: #fff;
}
.WebSite .services .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}
.WebSite .services .title {
  color: #111;
}
.WebSite .services .description {
  font-size: 15px;
  line-height: 28px;
  margin-bottom: 0;
}
.WebSite .services .icon-box:hover .title, .WebSite .services .icon-box:hover .description {
  color: #fff;
}
.WebSite .services .icon-box:hover .icon {
  background: #fff;
}
.WebSite .services .icon-box:hover .icon i {
  color: #339696;
}
.WebSite .prog_sep {
  text-align: center;
}
.WebSite .prog_sep img {
  width: 8vw;
  min-width: 60px;
  height: auto;
  margin: 2rem 0;
}
.WebSite .contact .info {
  color: #444444;
}
.WebSite .contact .info .elm {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
}
.WebSite .contact .info i {
  font-size: 36px;
  margin-left: 10px;
  color: #3498db;
  margin-bottom: 5px;
}
.WebSite .contact .info a {
  font-size: 1.2rem;
  color: black;
}
.WebSite .contact .info a:hover {
  color: blue;
}
.WebSite .contact .footer {
  text-align: center;
}
.WebSite .contact .footer img {
  width: 20vw;
  height: auto;
}
.WebSite .accordion .accordion-item {
  border: none;
  margin-bottom: 15px;
}
.WebSite .accordion .accordion-item .accordion-header .accordion-button div {
  width: 100%;
  text-align: right;
}
.WebSite .accordion .accordion-item .accordion-button:focus {
  box-shadow: none !important;
}
.WebSite .accordion .accordion-item h5 {
  margin-bottom: 1rem;
}
.WebSite .Page_Reception {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  direction: ltr;
}
.WebSite .Page_Reception .RDiv {
  text-align: center;
}
.WebSite .Page_Reception .RDiv img {
  width: 30vw;
  height: auto;
}
.WebSite .Page_Reception .LDiv {
  text-align: right;
  direction: rtl;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  /*background-color: yellow;*/
}
.WebSite .Page_Reception .LDiv .NameDiv {
  display: flex;
  flex-direction: row;
  /*justify-content: space-between;*/
  align-items: center;
  width: 100%;
}
.WebSite .Page_Reception .LDiv .NameDiv .Btn {
  margin-right: 2rem;
}
.WebSite .Page_Reception .LDiv .RegDiv {
  margin-top: 2rem;
}
.WebSite section {
  padding: 50px 0;
}
.WebSite .ProgClass {
  /*background-color:turquoise;*/
  /*margin: 2rem 0 1rem 0;*/
  margin-bottom: 1rem;
}
.WebSite .MyT {
  font-weight: 600;
  margin-left: 10px;
}
.WebSite .swiper {
  width: 95vw;
}
.WebSite .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  align-items: flex-start;
}
.WebSite .swiper-slide .MySlide {
  /*background-color: yellow !important;*/
  width: 100%;
  background-color: #f7fbfe;
}
.WebSite .swiper-slide .Slide_Header {
  width: 3rem;
  /*background-color: paleturquoise;*/
  height: 3.5rem;
  width: 100%;
  padding-top: 0.2rem;
  /*font-weight:800;*/
}
.WebSite .swiper-slide .Slide_Header h4 {
  color: #0e4e3e;
  font-weight: bold;
}
.WebSite .swiper-slide .Slide_Body {
  width: 100%;
  /*background-color: yellow !important;*/
  height: 400px;
  padding-top: 0.5rem;
  overflow: auto;
  margin-bottom: 2.2rem;
}
.WebSite .swiper-slide .Slide_Body h5 {
  line-height: 2;
}
.WebSite .swiper-button-next, .WebSite .swiper-button-prev {
  top: 2rem;
}
.WebSite .swiper-button-next::after, .WebSite .swiper-button-prev::after {
  font-size: 2.5rem;
}

.WebApp {
  background: #f6f9ff;
}
.WebApp .row {
  padding: 0;
  margin: 0;
}
.WebApp h1, .WebApp h2, .WebApp h3, .WebApp h4, .WebApp h5, .WebApp h6, .WebApp span, .WebApp p {
  line-height: 1.5;
}
.WebApp h6 {
  line-height: 2;
}
.WebApp .MainDiv {
  /*background-color: yellow;*/
  height: calc(100vh - 90px);
  overflow: auto;
  /*padding-right:15px;*/
}
.WebApp .main {
  margin-top: 90px;
}
.WebApp .form-floating {
  /*font-family: Almarai;*/
  /*font-family: biensport;*/
  font-family: droid;
  position: relative;
  margin-bottom: 5px;
  color: darkblue;
}
.WebApp .form-floating .form-control, .WebApp .form-floating .form-control-plaintext, .WebApp .form-floating .form-select {
  min-height: 65px !important;
  line-height: 1.8;
}
.WebApp .form-floating .form-select {
  background-position: left 0.75rem center;
  padding-right: 0.75rem;
}
.WebApp .form-floating label {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.WebApp .form-floating .form-control:focus ~ label,
.WebApp .form-floating .form-control:not(:placeholder-shown) ~ label,
.WebApp .form-floating .form-control-plaintext ~ label,
.WebApp .form-floating .form-select ~ label {
  /*opacity: 0.65;*/
  opacity: 1;
  transform: scale(1) translateY(-0.8rem) translateX(0) !important;
}
.WebApp .form-floating input:-webkit-autofill,
.WebApp .form-floating input:-webkit-autofill:hover,
.WebApp .form-floating input:-webkit-autofill:focus,
.WebApp .form-floating input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 35px white inset !important;
}
.WebApp .FrmFloating_ReadOnly .form-control:disabled, .WebApp .FrmFloating_ReadOnly .form-control[readonly] {
  background-color: white;
  /*opacity: 1;*/
}
.WebApp .FrmFloating_ReadOnly .form-control {
  border: 1px solid #ecf2f8;
}
.WebApp .DivMultiCol {
  padding: 0;
}
.WebApp .DivMultiCol .row {
  /*padding: 0;
  margin: 0;*/
}
.WebApp .DivMultiCol .row .col-md {
  margin: 0 5px 0 0;
}
.WebApp .DivMultiCol .row .col-md:last-child {
  margin: 0;
}
.WebApp .DivMultiCol .row > * {
  padding: 0;
  padding-right: 5px;
  min-height: 45px;
}
.WebApp .DivMultiCol textarea {
  height: 120px;
  resize: none;
}
.WebApp .Wizard_Body {
  /*background-color: yellow;*/
  height: calc(100vh - 350px);
  min-height: 350px;
}
.WebApp .Wizard_Body .Internal_Container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.WebApp .Wizard_Body .Internal_Container .form-control {
  width: 600px;
  max-width: 80vw;
}
.WebApp .Wizard_Body .Wizard_QStage_Step3 .Info_Row .Info_Title {
  font-weight: 600;
  font-size: 1.1rem;
}
.WebApp .Wizard_Body .Wizard_QStage_Step3 .Info_Row .Inf_Label {
  color: darkblue;
  margin-left: 1rem;
}
.WebApp .Wizard_Body .Wizard_QStage_Step3 .Info_Row .Info_Div {
  height: 30px;
}
.WebApp .Wizard_Body .Wizard_QStage_Step3 .Law_Row {
  /*background-color:yellow;*/
  color: darkred;
  font-weight: 600;
}
.WebApp .is_invalid {
  border: 2px solid #dc3545;
  color: red;
}
.WebApp input[type=date], .WebApp input[type=datetime-local] {
  text-align: right;
  /*cursor: pointer;*/
  font-family: Arial;
  padding-right: 0.75rem;
}
.WebApp input[type=date]::-webkit-calendar-picker-indicator, .WebApp input[type=datetime-local]::-webkit-calendar-picker-indicator {
  display: none;
}
.WebApp .accordion {
  /*transition: 0s !important;*/
}
.WebApp .accordion .accordion-item {
  border: none;
  margin-bottom: 15px;
}
.WebApp .accordion .accordion-item .accordion-header .accordion-button {
  background-color: #edeffa;
  box-shadow: none !important;
}
.WebApp .accordion .accordion-item .accordion-header .accordion-button div {
  width: 100%;
  text-align: right;
}
.WebApp .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  color: #0549b0;
}
.WebApp .accordion .accordion-item .accordion-body {
  background-color: #fbfcfe;
}
.WebApp .accordion .accordion-item .accordion-body MyT {
  font-weight: 600;
  margin-left: 10px;
}
.WebApp .accordion .accordion-item h5 {
  margin-bottom: 1rem;
}
.WebApp .ElmRow {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: baseline;
  /*line-height: 2;*/
}
.WebApp .ElmRow i {
  font-size: 0.6rem;
  padding-left: 10px;
  padding-bottom: 10px;
}
.WebApp .Btn_Container {
  /*background-color: yellow;*/
  width: 100%;
  height: 40px;
  margin-bottom: 10px;
}
.WebApp .Btn_Container .Main_Table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 2px 0;
}
.WebApp .Btn_Container .Main_Table td {
  text-align: center;
  border-radius: 5px;
  height: 40px;
}
.WebApp .Btn_Container .Main_Table .Zone_Num {
  font-family: Arial;
  font-size: 1.1rem;
  font-weight: 600;
  color: darkblue;
}
.WebApp .Btn_Container .Main_Table .Zone_Txt .Card_Btn {
  width: auto;
  font-size: 1.1rem;
  padding-top: 3px;
  padding: 0 8px !important;
}
.WebApp .Page_H40_Body {
  /*background-color: chartreuse;*/
  height: calc(100% - 50px);
  overflow: auto;
}
.WebApp .Card_Btn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 40px;
  width: 60px;
  border-radius: 5px;
  font-size: 1.4rem;
  padding-top: 3px;
}
.WebApp .Card_Btn:hover {
  background-color: #f8fafd;
  cursor: pointer;
  color: blue;
}
.WebApp .Card_Btn:active {
  font-size: 1.35rem;
  background-color: #f1f5f9;
}
.WebApp .Card_EmptyBtn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 40px;
  width: 60px;
  border-radius: 5px;
  font-size: 1.4rem;
}
.WebApp .Cmp_HMenu {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.WebApp .Cmp_HMenu .Card_Btn {
  font-size: 1.5rem !important;
}
.WebApp .Cmp_HMenu .Card_Btn:active {
  font-size: 1.45rem !important;
  padding-top: 5px;
}
.WebApp .Cmp_HMenu .Selected_MenuItem {
  color: #0025d0;
}
.WebApp .Link_Btn {
  /*background-color:yellow;*/
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 40px;
  width: 60px;
  border-radius: 5px;
  font-size: 24px;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.WebApp .Link_Btn a {
  /*background-color: yellow;*/
  color: darkblue;
  text-decoration: none;
  height: 100%;
  width: 100%;
  text-align: center;
  padding-top: 2px;
  /*padding-top: 0.5rem;*/
}
.WebApp .Link_Btn:hover {
  background-color: #f8fafd;
  cursor: pointer;
  color: blue;
}
.WebApp .Link_Btn:active {
  background-color: #f1f5f9;
}
.WebApp .Link_Btn:active a i {
  font-size: 1.35rem;
}
.WebApp .Dmd_Message .alert {
  padding: 8px 0 4px 0;
  margin-bottom: 5px;
}
.WebApp .Dmd_Message .alert h5 {
  /*font-size: 1.1rem;*/
}
.WebApp .E_Radio {
  /*background-color: cyan;*/
  display: flex;
  flex-direction: row;
  align-items: center;
}
.WebApp .E_Radio .Radio_Op {
  /*background-color: yellow;*/
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  margin-left: 2rem;
}
.WebApp .E_Radio .Radio_Op i {
  opacity: 0.3;
}
.WebApp .E_Radio .Radio_Op span {
  margin-right: 0.5rem;
}
.WebApp .E_Radio .Radio_Op:hover {
  cursor: pointer;
  color: blue;
}
.WebApp .E_Radio .Radio_Op:hover i {
  opacity: 0.4;
}
.WebApp .E_Radio .Selected_Op i {
  opacity: 1 !important;
  color: blue;
}
.WebApp .E_Radio .Selected_Op .Icon_On {
  display: inline-block;
}
.WebApp .E_Radio .Selected_Op .Icon_Off {
  display: none;
}
.WebApp .E_Radio .NotSelected_Op i {
  opacity: 0.3 !important;
}
.WebApp .E_Radio .NotSelected_Op .Icon_On {
  display: none;
}
.WebApp .E_Radio .NotSelected_Op .Icon_Off {
  display: inline-block;
}
.WebApp .E_Radio .Title {
  padding-left: 2rem;
  vertical-align: top;
}
.WebApp .Radio_Default_Style .Radio_Op {
  font-size: 1.15rem;
}
.WebApp .Radio_Default_Style .Radio_Op i {
  font-size: 1.2rem;
}
.WebApp .Radio_Default_Style .Selected_Op i {
  font-size: 1.25rem;
}
.WebApp .Radio_Default_Style .Title {
  font-size: 1.2rem;
}
.WebApp .E_Check {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.WebApp .E_Check span {
  color: black;
}
.WebApp .E_Check i {
  font-size: 1.7rem;
  margin-left: 0.5rem;
}
.WebApp .E_Check:hover {
  cursor: pointer;
  /*background-color: #f8fafd;*/
}
.WebApp .E_STN {
  /*background-color: yellow;*/
  width: 100%;
}
.WebApp .E_STN div:nth-child(1) {
  /*background-color:cyan;*/
  width: 100%;
  text-align: right;
  padding-right: 5px;
  opacity: 0.75;
}
.WebApp .E_STN div:nth-child(2) {
  width: 100%;
  text-align: left;
  color: darkblue;
  padding-left: 5px;
}
.WebApp .E_STN div:nth-child(2) .DivDate {
  text-align: left;
}
.WebApp .E_STN hr {
  margin: 5px 0 15px 0;
  opacity: 0.1;
}
.WebApp .E_Range {
  width: 100%;
  height: 50px;
  margin-bottom: 2rem;
}
.WebApp .E_Range span {
  font-family: Arial;
  font-size: 1.4rem;
}
.WebApp .E_Range .Div_Title span {
  font-family: Almarai;
  font-size: 1rem;
}
.WebApp .E_Range .Div_Val span {
  font-size: 1.5rem;
  font-weight: 600;
  text-align: center;
  border-radius: 0.2rem;
  border: 0.5px solid #dadbe1;
  width: 120px;
  display: inline-block;
}
.WebApp .E_Range div {
  text-align: center;
}
.WebApp .E_Range table {
  width: 100%;
}
.WebApp .E_Range table td {
  height: 40px;
}
.WebApp .E_Range table td:first-child, .WebApp .E_Range table td:last-child {
  width: 40px;
  text-align: center;
  vertical-align: top;
}
.WebApp .E_Range table td:nth-child(2) {
  vertical-align: bottom;
}
.WebApp .DPicker_Card {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.WebApp .DPicker_Card .Cell {
  /*background-color:khaki;*/
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
}
.WebApp .DPicker_Card .Cell:hover {
  cursor: pointer;
  background-color: #f8fafd;
}
.WebApp .DPicker_Card .Cell div {
  /*height: 34px;*/
  /*background-color:yellow;*/
}
.WebApp .DPicker_Card .ReadOnly_Cell {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
}
.WebApp .DPicker_Card .ReadOnly_Cell div {
  height: 34px;
  font-style: italic;
  color: silver;
  padding-top: 2px;
}
.WebApp .DPicker_Card .Day_Name {
  font-size: 1rem;
}
.WebApp .DPicker_Card i {
  font-size: 1.7rem;
}
.WebApp .DPicker_Card .Active_Day {
  color: darkblue;
}
.WebApp .Selected_Item {
  color: blue;
}
.WebApp .Selected_Item .Item_On {
  display: inline-block;
}
.WebApp .Selected_Item .Item_Off {
  display: none;
}
.WebApp .UnSelected_Item .Item_On {
  display: none;
}
.WebApp .UnSelected_Item .Item_Off {
  display: inline-block;
}
.WebApp .DataList_Test {
  width: 100%;
  font-family: Arial;
  direction: ltr;
  font-size: 0.8rem;
}
.WebApp .DataList_Test tr:hover {
  background-color: #f6f9ff;
}
.WebApp .DataList_Test th {
  position: sticky;
  top: 0px;
  height: 40px;
  background-color: #d7e2f0;
  padding: 0 10px;
  border-bottom: 2px solid white;
  font-weight: normal;
}
.WebApp .DataList_Test td {
  height: 30px;
  padding: 0 10px;
  border-bottom: 0.2px solid Gainsboro;
}
.WebApp .DataList_Test .DayOff {
  background-color: yellow;
}
.WebApp .Card_DayProg {
  /*background-color: cyan;*/
  width: 95%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 0.25rem;
}
.WebApp .Card_DayProg .DPR_Elm {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.WebApp .Card_DayProg .DPR_Elm .Div_Lbl {
  width: 6rem;
  font-size: 1.5rem;
  text-align: left;
}
.WebApp .Card_DayProg .DPR_Elm .Div_Icon i {
  font-size: 2rem;
  margin: 0 1rem;
}
.WebApp .Card_DayProg .DPR_Elm .Div_Wrd {
  /*background-color: cyan;*/
  width: 6rem;
  font-size: 1.5rem;
  font-family: Arial;
  font-weight: 600;
  color: darkblue;
}
.WebApp .Card_DayProg .DPR_Elm .Div_Count {
  /*background-color: yellow;*/
  width: 4rem;
}
.WebApp .Card_DayProg .DPR_Elm .Div_Count span {
  margin-left: 5px;
  font-family: Arial;
  font-size: 1.2rem;
}
.WebApp .Card_DayProg .DPR_Elm .Div_Count i {
  font-size: 1.2rem;
}
.WebApp .Card_DayProg .Plan_Row {
  /*background-color: yellow;*/
}
.WebApp .Card_DayProg .Plan_Row:hover {
  cursor: pointer;
}
.WebApp .Card_DayProg .Mntr_Row {
  /*background-color: cyan;*/
}
.WebApp .Card_DayProg .Mntr_Row:hover {
  cursor: pointer;
}
.WebApp .Card_DayProg .Werd_Elm {
  /*width: 6rem;*/
  font-size: 1.5rem;
  text-align: center;
}
.WebApp .Card_DayProg .Werd_Elm .JH_Nbr {
  font-size: 1.5rem;
  font-family: Arial;
  font-weight: 600;
  color: darkblue;
}
.WebApp .Card_DayProg .Werd_Elm .Div_Page {
  /*background-color: cyan;*/
  font-family: Arial;
}
.WebApp .Card_DayProg .Werd_Elm .Sep {
  width: 6rem;
  font-size: 1.5rem;
  font-family: Arial;
  font-weight: 600;
}
.WebApp .Card_DayProg .Div_WerdMntr {
  /*background-color: orange;*/
  text-align: center;
  padding: 10px 20px;
  margin-bottom: 5px;
}
.WebApp .Card_DayProg .Div_WerdMntr span {
  font-size: 1.1rem;
}
.WebApp .Card_DayProg .Div_WerdMntr i {
  font-size: 1.4rem;
}
.WebApp .Card_DayProg .Div_WerdMntr:hover {
  background-color: #f8fafd;
  cursor: pointer;
  color: blue;
}
.WebApp .Card_DayProg .Div_WerdMntr:active {
  /*font-size: 1.35rem;*/
  background-color: #f1f5f9;
}
.WebApp .Card_DayProg hr {
  margin-bottom: 1rem;
  margin-top: 5px;
}
.WebApp .Card_WeekProg {
  width: 100%;
}
.WebApp .Card_WeekProg tr:hover {
  cursor: pointer;
  background-color: #f8fafd;
}
.WebApp .Card_WeekProg td {
  height: 38px;
  border-bottom: 0.2px solid Gainsboro;
}
.WebApp .Card_WeekProg .Div_Lbl {
  /*background-color: cyan;*/
  width: 20%;
  min-width: 100px;
  padding-right: 10px;
}
.WebApp .Card_WeekProg .Div_Val {
  /*background-color: yellow;*/
}
.WebApp .Card_WeekProg .Div_Val i {
  font-size: 1.45rem;
  margin: 0 5px;
}
.WebApp .Card_WeekProg .Div_Mntr {
  /*background-color: orange;*/
  width: 50px;
  text-align: center;
}
.WebApp .Card_WeekProg .Div_Mntr i {
  font-size: 1.45rem;
}
.WebApp .Card_WeekProg .Div_Mntr:hover {
  background-color: #edfaff;
}
.WebApp .Card_WeekProg .CurrentDay {
  /*background-color: #f7fffea6;*/
  background: #020024;
  background: linear-gradient(90deg, rgb(2, 0, 36) 0%, rgb(207, 237, 255) 0%, rgb(255, 255, 255) 100%);
}
.WebApp .Card_WeekProg .CurrentDay .Div_Lbl {
  color: blue;
  font-weight: 600;
}
.WebApp .QHome_Balance {
  /*background-color: yellow;*/
  height: inherit;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: Arial;
  font-size: 3rem;
  font-weight: 800;
  color: #0013b7;
}
.WebApp .QHome_StgChart {
  /*background-color: yellow;*/
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.WebApp .Card_Calendar {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.WebApp .Card_Calendar .Cln_Body {
  /*background-color: cyan;*/
  width: 100%;
  height: calc(100vh - 230px);
  overflow: auto;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table {
  width: 100%;
  table-layout: fixed;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table tr:last-child td {
  border-bottom: 0.2px solid Gainsboro;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table td {
  text-align: center;
  border-top: 0.2px solid Gainsboro;
  border-right: 0.2px solid Gainsboro;
  padding: 0;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table td:last-child {
  border-left: 0.2px solid Gainsboro;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .Cell {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .HCell {
  justify-content: center;
  height: 3rem;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .BCell {
  /*background-color:yellow;*/
  justify-content: start;
  height: 12vh;
  min-height: 5rem;
  max-height: 5.5rem;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .BCell .Date_Zone {
  /*background-color:yellow;*/
  font-weight: 700;
  color: #b3b8d0;
  height: 25px;
  margin-top: 5px;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .BCell .Main_Zone {
  /*background-color: yellow;*/
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: calc(12vh - 30px);
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .BCell .Main_Zone .Day_Prog {
  color: #99a3d2;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .BCell .Main_Zone i {
  font-size: 1.4rem;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .BCell:hover {
  cursor: pointer;
  background-color: #f8fafd;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .Current_Day {
  /*background-color: #c9f0f6;*/
  border-bottom: 3px solid blue;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .Current_Day .Date_Zone {
  color: blue !important;
  font-weight: 800;
}
.WebApp .Card_Calendar .Cln_Body .Main_Table .Current_Day .Day_Prog {
  color: blue !important;
}
.WebApp .AdmDos_Finder .Txt_Zone {
  width: 30vw;
  max-width: 200px;
}
.WebApp .AdmDos_Finder .bi-eraser-fill {
  color: #7564bf;
}

.LoginPage {
  /*background-color: yellow;*/
}
.LoginPage .AppName {
  font-size: 2.5rem;
  font-family: biensport_bold;
  color: #0e4e3e;
}
.LoginPage .form-input {
  border: none;
  border-radius: 0;
  margin: 5px 0;
  box-shadow: 0 1px 0 0 #e5e5e5;
}
.LoginPage form {
  width: 100%;
  max-width: 300px;
}
.LoginPage ul {
  list-style-type: none;
  padding: 0 !important;
}
.LoginPage .My_frmfloating {
  position: relative;
}
.LoginPage .My_frmfloating .form-control, .LoginPage .My_frmfloating .form-control-plaintext, .LoginPage .My_frmfloating .form-select {
  height: calc(3.5rem + 2px);
  line-height: 1.25;
}
.LoginPage .My_frmfloating label {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 1rem 0.75rem;
  overflow: hidden;
  text-align: start;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
  border: 1px solid transparent;
  transform-origin: 0 0;
  transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
}
.LoginPage .My_frmfloating .form-control, .LoginPage .My_frmfloating .form-control-plaintext {
  padding: 1rem 0.75rem;
}
.LoginPage .My_frmfloating .form-control, .LoginPage .My_frmfloating .form-control::-moz-placeholder, .LoginPage .My_frmfloating .form-control-plaintext::-moz-placeholder {
  color: transparent;
}
.LoginPage .My_frmfloating .form-control::placeholder, .LoginPage .My_frmfloating .form-control-plaintext::placeholder {
  color: transparent;
}
.LoginPage .My_frmfloating .form-control:focus, .LoginPage .My_frmfloating .form-control:not(:placeholder-shown),
.LoginPage .My_frmfloating .form-control-plaintext:focus,
.LoginPage .My_frmfloating .form-control-plaintext:not(:placeholder-shown) {
  padding-top: 1.625rem;
  padding-bottom: 0.625rem;
}
.LoginPage .My_frmfloating .form-control:-webkit-autofill,
.LoginPage .My_frmfloating .form-control-plaintext:-webkit-autofill {
  padding-top: 1.625rem;
  padding-bottom: 0.625rem;
}
.LoginPage .My_frmfloating .form-control:focus ~ label,
.LoginPage .My_frmfloating .form-control:not(:placeholder-shown) ~ label,
.LoginPage .My_frmfloating .form-control-plaintext ~ label,
.LoginPage .My_frmfloating .form-select ~ label {
  opacity: 0.65;
  /*transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);*/
  transform: scale(0.85) translateY(-0.5rem) translateX(3.2rem);
}
.LoginPage .My_frmfloating .form-control:-webkit-autofill ~ label {
  opacity: 0.65;
  transform: scale(0.85) translateY(-0.5rem) translateX(3.2rem);
}
.LoginPage .My_frmfloating .form-control-plaintext ~ label {
  border-width: 1px 0;
}
.LoginPage .My_frmfloating input:-webkit-autofill,
.LoginPage .My_frmfloating input:-webkit-autofill:hover,
.LoginPage .My_frmfloating input:-webkit-autofill:focus,
.LoginPage .My_frmfloating input:-webkit-autofill:active {
  /*-webkit-box-shadow: 0 0 0 30px white inset !important;*/
}
.LoginPage .BtnDiv {
  margin-top: 1rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.LoginPage .BtnDiv .BtnLogin {
  width: 60%;
}
.LoginPage .BtnDiv .BtnLogin:not(:hover) {
  background-color: white;
}
.LoginPage .BtnDiv .BtnGoogle {
  width: 35%;
}
.LoginPage .BtnDiv .LBtn {
  text-align: center;
}
.LoginPage .LoginMsg {
  /*background-color: yellow;*/
  width: 100%;
  font-size: 1.2rem;
  color: red;
}

.App_Notification {
  background-color: red;
  color: white;
  border-radius: 3px;
  padding: 0px 6px;
  font-size: 0.8rem;
  font-family: Arial;
  position: absolute;
  top: 10px;
  left: 0px;
}

.Menu_Notification {
  background-color: red;
  color: white;
  border-radius: 3px;
  padding: 0px 6px;
  font-size: 0.9rem;
  font-family: Arial;
  position: absolute;
  margin-right: 5px;
}

.Elm_NotifCard {
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  border-top: 1px solid #eeeeee;
  width: 99%;
  margin: 0 auto 10px auto;
  text-align: center;
}
.Elm_NotifCard .TD_Msg {
  text-align: right;
  padding: 5px 10px 5px 0;
  font-size: 1.2rem;
}
.Elm_NotifCard .TD_Btn {
  width: 50px;
  vertical-align: top;
}
.Elm_NotifCard .TD_Btn div {
  width: 100%;
  font-size: 1.4rem;
  padding: 5px 10px 5px 10px;
  /*background-color: yellow;*/
}
.Elm_NotifCard .TD_Btn div:hover {
  color: darkred;
  cursor: pointer;
}

.HorizontalMenu {
  /*background-color: yellow;*/
  width: 100%;
  table-layout: fixed;
}
.HorizontalMenu td {
  /*background-color: cyan;*/
  height: 40px;
  border-bottom: 1px solid #CCC;
}
.HorizontalMenu td:nth-child(1) .HM_Item {
  border-right: none;
}
.HorizontalMenu td:hover {
  cursor: pointer;
  font-weight: 600;
  color: blue;
  border-bottom: 2px solid blue;
}
.HorizontalMenu .HM_Item {
  /*background-color: yellow;*/
  border-right: 1px solid #CCC;
  height: 35px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.HorizontalMenu .Active_Item {
  font-weight: 600;
  color: darkblue;
  border-bottom: 2px solid darkblue;
}

.QPart_Picker {
  /*background-color: azure;*/
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.QPart_Picker .QPart_CHeader {
  /*background-color: powderblue;*/
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.QPart_Picker .QPart_THeader {
  /*background-color: cyan;*/
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.QPart_Picker .QPart_Body {
  /*background-color: lime;*/
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.QPart_Picker .QPart_Body .QPart_Row {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.QPart_Picker .QPart_Body .QPart_Row .Cell {
  /*background-color:khaki;*/
  /*box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;*/
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 2px;
  flex-grow: 1;
  border: 1px solid #CCC;
  border-radius: 4px;
}
.QPart_Picker .QPart_Body .QPart_Row .Cell .Cell_Txt {
  /*background-color:yellow;*/
  min-width: 40px;
  width: 100%;
  text-align: center;
  font-family: Arial;
  font-weight: 600;
  font-size: 1.5rem;
  color: lightgray;
}
.QPart_Picker .QPart_Body .QPart_Row .Cell:hover {
  cursor: pointer;
  background-color: #f8fafd;
}
.QPart_Picker .QPart_Body .QPart_Row .Cell:hover .Cell_Txt {
  color: black;
}
.QPart_Picker .QPart_Body .QPart_Row .ReadOnly_Cell:hover {
  cursor: default !important;
}
.QPart_Picker .QPart_Body .QPart_Row .QPart_Btn {
  /*background-color: turquoise;*/
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 2px;
  flex-grow: 1;
  border: 1px solid #CCC;
  border-radius: 4px;
  height: 40px;
}
.QPart_Picker .QPart_Body .QPart_Row .QPart_Btn span_num {
  font-family: Arial;
  margin-right: 0.2rem;
}
.QPart_Picker .QPart_Body .QPart_Row .QPart_Btn:hover {
  cursor: pointer;
  background-color: #f8fafd;
}
.QPart_Picker .QPart_Body .Joze_Row .Cell {
  height: 4rem;
}
.QPart_Picker .QPart_Body .Hezb_Row .Cell {
  height: 2rem;
}
.QPart_Picker .QPart_Body .Hezb_Row .Cell .Cell_Txt {
  font-weight: 600;
  font-size: 1.2rem;
}
.QPart_Picker .QPart_Body .QBase_Cell {
  background-color: #00BFFF !important;
}
.QPart_Picker .QPart_Body .QBase_Cell .Cell_Txt {
  color: black !important;
}
.QPart_Picker .QPart_Body .QBase_Cell:hover {
  background-color: LightSkyBlue !important;
}
.QPart_Picker .QPart_Body .QNew_Cell {
  background-color: #40E0D0 !important;
}
.QPart_Picker .QPart_Body .QNew_Cell .Cell_Txt {
  color: black !important;
}
.QPart_Picker .QPart_Body .QNew_Cell:hover {
  background-color: #43e8d8 !important;
}
.QPart_Picker .QPart_Body .QX_Cell {
  background-color: #adbfdb !important;
}
.QPart_Picker .QPart_Body .QX_Cell .Cell_Txt {
  color: black !important;
}
.QPart_Picker .QPart_Body .QX_Cell:hover {
  cursor: default !important;
}
.QPart_Picker .QPart_Footer {
  /*background-color: palegreen;*/
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.QPart_Picker .QPart_Footer span_num {
  font-family: Arial;
  margin-right: 0.2rem;
}
.QPart_Picker .QPart_Footer .QFooter_Trigger:hover {
  cursor: pointer;
  background-color: #f8fafd;
}
.QPart_Picker .OptionBtn {
  border: 1px solid #CCC;
  border-radius: 4px;
  margin: 0 2px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
  height: 40px;
}
.QPart_Picker .Clickable:hover {
  cursor: pointer;
  background-color: #f8fafd;
}

/* #region Page_Zone */
.DropdownBtn {
  /*background-color: skyblue;*/
  width: 70px;
  text-align: center;
}
.DropdownBtn:hover {
  cursor: pointer;
  color: Blue;
  background: #f6f9ff;
}
.DropdownBtn:hover a {
  color: blue;
}
.DropdownBtn a {
  /*background-color: yellow !important;*/
  display: inline-block;
  width: 100%;
  /*height: 60px;*/
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  color: #5d729a;
}
.DropdownBtn .dropdown-menu:hover {
  cursor: default;
}

.TopCard {
  /*background-color:aqua;*/
  width: 100%;
}
.TopCard td {
  height: 40px;
}
.TopCard .Top_Title {
  width: 1%;
  white-space: nowrap;
  font-size: 1.2rem;
  /*font-size: 1rem;*/
  font-weight: 600;
  color: #5d729a;
  padding-right: 5px;
}
.TopCard .Top_Btn {
  width: 60px;
  text-align: center;
  /*color: #899bbd;*/
  color: #5d729a;
  border-radius: 5px;
}
.TopCard .Top_Btn i {
  font-size: 1.4rem;
}
.TopCard .Top_Btn:hover {
  cursor: pointer;
  color: blue;
  background-color: #e7effb;
}
.TopCard .Back_Btn {
  width: 60px;
  font-size: 2.2rem;
  font-size: 2rem;
  color: #5d729a;
  border-radius: 5px;
}
.TopCard .Back_Btn:hover {
  cursor: pointer;
  color: blue;
  background-color: #e7effb;
}
.TopCard .Top_Icon {
  width: 60px;
  text-align: center;
  border-radius: 5px;
}
.TopCard .Top_Icon i {
  font-size: 1.4rem;
}
.TopCard .BookMarkOn {
  color: #4545d6;
}
.TopCard .Top_Msg {
  /*background-color: yellow;*/
  padding: 0 10px;
  text-align: right;
  color: darkred;
}

.FPage_Header {
  padding: 7px 5px;
  margin-bottom: 15px !important;
}
.FPage_Header table {
  /*background-color: aqua;*/
  width: 100%;
}
.FPage_Header table td {
  height: 40px;
}
.FPage_Header table .Top_Title {
  font-size: 1.15rem;
  padding-right: 10px;
}
.FPage_Header table .Top_Btn {
  width: 60px;
  text-align: center;
  color: #5d729a;
  border-radius: 5px;
}
.FPage_Header table .Top_Btn i {
  font-size: 1.4rem;
}
.FPage_Header table .Top_Btn:hover {
  background-color: #f8fafd;
  cursor: pointer;
  color: blue;
}
.FPage_Header table .Top_Btn:active {
  font-size: 1.35rem;
  background-color: #f1f5f9;
}

.Page_BodyContent {
  /*background-color: yellow;*/
}
.Page_BodyContent .Internal_Body {
  /*background-color: skyblue;*/
  height: calc(100vh - 180px);
  overflow: auto;
}
.Page_BodyContent .BodyCtg_1Z {
  /*background-color: yellow;*/
  height: calc(100vh - 180px);
  overflow: auto;
}
.Page_BodyContent .BodyCtg_2Z {
  /*background-color: yellow;*/
  height: calc(100vh - 249px);
  overflow: auto;
}
.Page_BodyContent .Elm_LiveDmd {
  /*background-color: yellow;*/
  max-width: 700px;
  max-width: 800px;
  margin: 0 auto;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body {
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  border-top: 1px solid #eeeeee;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div1 {
  text-align: center;
  font-size: 1.2rem;
  padding-top: 10px;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div1 h5 {
  margin: 0;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div1 .Prg_Cls {
  font-weight: bold;
  color: darkblue;
  font-size: 1.1rem;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div1 table td:nth-child(1) {
  text-align: right;
  padding-right: 10px;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div1 table td:nth-child(2) {
  padding-left: 10px;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div2 {
  /*background-color: #fcff93;*/
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
  text-align: center;
  font-size: 1.1rem;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div3 table .TD_Info {
  padding-right: 10px;
  font-size: 0.9rem;
  /*color:silver;*/
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .Div3 table .Rem_Btn:hover {
  color: red;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .DmdStatus_0 {
  background-color: #fcff93;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .DmdStatus_1 {
  background-color: #fcff92;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .DmdStatus_2 {
  background-color: #ffd7d7;
  padding: 8px 0;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Body .DmdStatus_2 i {
  color: #c01515;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Footer_000 {
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
}
.Page_BodyContent .Elm_LiveDmd .Dmd_Footer_000 div {
  border-radius: inherit;
}
.Page_BodyContent .Reg_Wizard_PrgCls {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.Page_BodyContent .Reg_Wizard_PrgCls .Elm_PrgCls {
  /*background-color: yellow;*/
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  border-top: 1px solid #eeeeee;
  margin: 5px;
  padding: 10px;
  /*height: 100px; // tmp*/
  flex-grow: 1;
  min-width: 250px;
  max-width: 500px;
}
.Page_BodyContent .Elm_DosReg {
  /*background-color: yellow;*/
  /*max-width: 700px;*/
  max-width: 800px;
  margin: 0 auto;
}
.Page_BodyContent .Elm_DosReg .Reg_Body {
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  border-top: 1px solid #eeeeee;
  margin: 0 1px;
}
.Page_BodyContent .Elm_DosReg .Reg_Body .Div_Main {
  /*background-color: yellow;*/
  font-size: 1.2rem;
  padding: 4px;
}
.Page_BodyContent .Elm_DosReg .Reg_Body .Div_Main .Card_EmptyBtn {
  color: blue;
}
.Page_BodyContent .Elm_DosReg .Reg_Body .Div_Main table .Name_Div {
  /*background-color: chartreuse;*/
  display: flex;
  flex-direction: row;
}
.Page_BodyContent .Elm_DosReg .Reg_Body .Div_Main table .Name_Div i {
  font-size: 1.4rem;
  margin-left: 10px;
}
.Page_BodyContent .SocialMedia_Msg {
  /*background-color: turquoise;*/
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.Page_BodyContent .SocialMedia_Msg .Row_Welcom {
  /*background-color: yellow;*/
  text-align: center;
  /*width: 100%;*/
}
.Page_BodyContent .SocialMedia_Msg .Row_Welcom .EliteProg_Icon img {
  width: 7rem;
  height: auto;
}
.Page_BodyContent .SocialMedia_Msg .Row_Welcom span1 {
  font-size: 1.5rem;
}
.Page_BodyContent .SocialMedia_Msg .Row_Welcom span2 {
  font-size: 1.6rem;
  font-weight: 700;
}
.Page_BodyContent .SocialMedia_Msg .Row_Status {
  /*background-color: yellow;*/
}
.Page_BodyContent .SocialMedia_Msg .Row_Status .Row_MainContact h5 {
  display: inline-block;
}
.Page_BodyContent .SocialMedia_Msg .Row_Status .Row_MainContact a {
  margin-right: 10px;
}
.Page_BodyContent .SocialMedia_Msg .Row_Status .Row_DmdMsg {
  /*background-color: cyan;*/
}
.Page_BodyContent .SocialMedia_Msg .Row_Status .Row_DmdMsg .MsgBody {
  padding: 5px 10px;
  border-radius: 0.4rem;
  background-color: #e1f0f9;
  /*font-size: 1.1rem;*/
}
.Page_BodyContent .SocialMedia_Msg .Row_Status .Row_DmdMsg .MsgBody h5 {
  /*font-size: 1rem;*/
}
.Page_BodyContent .SocialMedia_Msg .Row_Status .TmpMsg_Copied {
  padding: 12px 10px 0px 10px;
}
.Page_BodyContent .SocialMedia_Msg .Row_BackupContact .Numeric {
  color: darkblue;
  font-weight: 600;
}
.Page_BodyContent .SocialMedia_Msg .Row_BackupContact a {
  font-size: 1.2rem;
}
.Page_BodyContent .FPage_DProg {
  /*background-color: yellow;*/
  height: calc(100vh - 220px);
  overflow: auto;
  padding-top: 10px;
}
.Page_BodyContent .FPage_DProg .Body_1Col {
  max-width: 350px;
  margin: 0 auto;
}
.Page_BodyContent .FPage_DProg .Body_2Col {
  max-width: 500px;
  margin: 0 auto;
}
.Page_BodyContent .FPage_DProg .Body_3Col {
  max-width: 700px;
  margin: 0 auto;
}
.Page_BodyContent .FPage_DProg .row > * {
  padding: 2px !important;
}
.Page_BodyContent .FPage_DProg .Wrd_Hdr {
  /*background-color: #e4eaf3;*/
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  font-size: 1.1rem;
  height: 40px;
}
.Page_BodyContent .FPage_DProg .Wrd_Body {
  /*background-color: skyblue;*/
  height: calc(100vh - 275px);
  overflow: auto;
}
.Page_BodyContent .FPage_DProg .Wrd_Body .Wrd_List .Wrd_Item {
  font-family: Arial;
  font-size: 1.2rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 2px 0;
  border: 1px solid #CCC;
  border-radius: 4px;
  height: 35px;
}
.Page_BodyContent .FPage_DProg .Wrd_Body .Wrd_List .Wrd_Item:hover {
  cursor: pointer;
  background-color: #f8fafd;
}
.Page_BodyContent .Elite_RegDmd {
  max-width: 1000px;
  margin: 0 auto;
}

.card {
  /*background-color: yellow;*/
  border: none;
  /*box-shadow: 0px 0 30px rgba(1, 41, 112, 0.1);*/
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
  margin: 1px;
}

.Wizard_TabName {
  /*background-color: yellow;*/
  padding-right: 5px;
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: darkblue;
}

.Summary_Card .Info_Row .Info_Title {
  font-weight: 600;
  font-size: 1.1rem;
}
.Summary_Card .Info_Row .Inf_Label {
  color: #1d1dd3;
  margin-left: 1rem;
}
.Summary_Card .Info_Row .Info_Div {
  height: 40px;
}
.Summary_Card .Law_Row {
  /*background-color:yellow;*/
  color: darkred;
  font-weight: 600;
}

.LayoutM {
  /*background-color: yellow;*/
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.LayoutM .LayoutBody {
  /*background-color: orange;*/
}
.LayoutM .LayoutBody .form-control:disabled {
  /*background-color: white;*/
}
.LayoutM .BtnListContainer {
  padding-right: 5px;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.LayoutM .BtnListContainer .Right_Area {
  padding-left: 5px;
  width: 50%;
}
.LayoutM .BtnListContainer .Left_Area {
  padding-right: 5px;
  width: 50%;
}
.LayoutM .StepperDiv {
  /*background-color: yellow;*/
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0.5rem 0;
}
.LayoutM .StepperDiv .Stepper {
  /*background-color: cyan;*/
  font-family: Arial;
  width: 600px;
  max-width: 80vw;
}
.LayoutM .StepperDiv .Stepper .Step_TD {
  width: 1%;
  white-space: nowrap;
}
.LayoutM .StepperDiv .Stepper .Step_Cell {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #eaebf5;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: #81869e;
  font-size: 1.2rem;
  font-weight: 700;
}
.LayoutM .StepperDiv .Stepper .Line_Cell {
  background-color: #eaebf5;
  height: 10px;
}
.LayoutM .StepperDiv .Stepper .Step_Completed {
  background-color: #72dbcd;
  color: black;
}
.LayoutM .StepperDiv .Stepper .Step_Active {
  background-color: #0289bb;
  color: black;
  color: white;
}

.Card_Container {
  /*background-color: yellow;*/
  width: 99.5%;
}
.Card_Container .card {
  margin-left: 15px;
  margin-bottom: 15px;
}
.Card_Container .Card_Header table {
  width: 100%;
  margin-top: 5px;
  /*background-color: yellow;*/
}
.Card_Container .Card_Header table td {
  height: 40px;
}
.Card_Container .Card_Header table td:nth-child(2) {
  width: 60px;
}
.Card_Container .Card_Header table .CrdHdr_Title {
  font-weight: 600;
  color: darkblue;
  font-size: 1.2rem;
}
.Card_Container .Card_Body {
  /*background-color: cyan;*/
  height: calc(100% - 60px);
  padding-top: 5px;
  overflow: auto;
}
.Card_Container .Card_Body .TxtBtn {
  font-size: 1.1rem;
}
.Card_Container .Card_Body .TxtBtn:active {
  font-size: 1.09rem;
}
.Card_Container .Card_Body .BtnBody {
  height: 35px;
}
.Card_Container .Card_Body .Css_W1 svg {
  width: 2.4rem;
}
.Card_Container .Card_Body .Css_M1 svg {
  width: 2.7rem;
}
.Card_Container .Card_Body .MW_Icon {
  /*background-color: yellow;*/
}
.Card_Container .Card_Body .MW_Icon i {
  font-size: 2.5rem;
  position: relative;
  color: #b40dbc;
  top: 10px;
}
.Card_Container .Card_Body .MW_Icon .Men {
  left: -20px;
  color: #0f26ad;
  z-index: 1;
}
.Card_Container .Card_Body img {
  width: 4rem;
}
.Card_Container .Card_Body span_flag {
  width: 4rem;
  height: 3rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  font-size: 1.5rem;
  font-weight: 700;
  background-color: #dedbed;
  color: darkblue;
}
.Card_Container .Card_Body .Card_DLContainer {
  /*background-color:lawngreen;*/
  margin-top: -5px;
}
.Card_Container .Card_Body .Card_DLContainer .DataList th {
  top: -5px;
  height: 45px;
}
.Card_Container .Card_BodyOnly {
  /*background-color: orange;*/
  height: calc(100% - 60px);
  height: 100%;
  padding-top: 5px;
  overflow: auto;
}
.Card_Container .Card_ProgStore {
  /*background-color: yellow;*/
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.Card_Container .Card_ProgStore .Div_Info {
  /*background-color: chartreuse;*/
  width: 100%;
}
.Card_Container .Card_ProgStore .Div_Info .EliteProg_Icon {
  position: absolute;
  top: 15px;
  left: 10px;
}
.Card_Container .Card_ProgStore .Div_Info .EliteProg_Icon img {
  width: 5rem;
  height: auto;
}
.Card_Container .Card_ProgStore .Div_Reg {
  /*background-color: orange;*/
  width: 100%;
  min-height: 55px;
}
.Card_Container .Card_ProgStore .Div_Reg .alert {
  padding: 8px 0 4px 0;
  margin-bottom: 0;
  /*border:none;*/
}
.Card_Container .GrpMngr_Contact {
  width: 100%;
}
.Card_Container .GrpMngr_Contact td:nth-child(1) p {
  margin: 0;
  font-size: 18px;
}
.Card_Container .GrpMngr_Contact td:nth-child(1) span {
  font-size: 14px;
  opacity: 0.6;
}
.Card_Container .GrpMngr_Contact td:nth-child(2) {
  /*background-color: #f6f9ff;*/
  vertical-align: top;
}
.Card_Container .GrpMngr_Contact .Sep {
  height: 10px;
}
.Card_Container .GrpMngr_Contact .BtnZone {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  /*align-items: flex-start;*/
}
.Card_Container .echart {
  /*background-color:yellow;*/
  font-family: Almarai !important;
}
.Card_Container .echart canvas {
  /*background-color: yellow;
  margin:0;
  padding:0;*/
  /*font-family: Almarai !important;*/
}

.Div_RL {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.Home_WerdList {
  height: calc(100vh - 270px);
  overflow: auto;
}
.Home_WerdList .Werd_Name {
  font-size: 1.1rem;
  width: 90%;
  margin: 0 auto;
  padding: 5px;
}
.Home_WerdList .BColor_Kiraa {
  /*background: linear-gradient(135deg, #e6fffa, #8BFCD5); // ****/
  /*background: linear-gradient( 135deg, #0b1f17 0%, #14532d 35%, #22c55e 70%, #86efac 100% );*/
  /*background: linear-gradient( 315deg, #0b1f17 0%, #14532d 35%, #22c55e 70%, #86efac 100% );*/
  /*background: linear-gradient( 315deg, #1f6f4a 0%, #34d399 35%, #6ee7b7 70%, #d1fae5 100% );*/
  /*background: linear-gradient( 315deg, #a7f3d0 0%, #d9f9f0 50%, #f0fdf4 100% );*/
  background: linear-gradient(315deg, #d9f9f0 0%, #bfffe6 25%, #a7f3d0 50%, #c8f7e9 75%, #f0fdf4 100%);
}
.Home_WerdList .BColor_Kiyem {
  /*background: linear-gradient(135deg, #8BFCD5, #4fd1c5);*/
  /*background: linear-gradient( 135deg, #0b1220 0%, #162447 35%, #1e40af 70%, #3b82f6 100% );*/
  /*color: white;*/
  background: linear-gradient(315deg, #e0f2fe 0%, #bae6fd 25%, #7dd3fc 50%, #93c5fd 75%, #f0f9ff 100%);
}

.Stage_WerdList {
  padding: 20px 10px;
}
.Stage_WerdList .Div_R {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  align-items: flex-end;
  /*background-color: yellow;*/
}
.Stage_WerdList .Div_R .WrdName {
  font-size: 1.2rem;
  margin-right: 0.5rem;
  /*padding-bottom:4px;*/
}
.Stage_WerdList .Div_R i {
  font-size: 1.5rem;
}
.Stage_WerdList .Div_L {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  /*background-color: yellow;*/
}
.Stage_WerdList .Div_L .Info_Status {
  font-style: italic;
  color: gray;
}
.Stage_WerdList:hover {
  background-color: #f8fafd;
  cursor: pointer;
  color: blue;
}
.Stage_WerdList:active {
  /*font-size: 1.35rem;*/
  background-color: #f1f5f9;
}

/* #endregion */
/* #region Constant_Zone */
.mt_10 {
  margin-top: 4px !important;
}

.mt_15 {
  margin-top: 15px !important;
}

.mt_20 {
  margin-top: 20px !important;
}

.fs_1p2 {
  font-size: 1.2rem !important;
}

.h_70 {
  height: 70px !important;
}

.h_Full {
  height: 100% !important;
}

.mw_100 {
  min-width: 100px !important;
}

.mw_120 {
  min-width: 120px !important;
}

.mw_140 {
  min-width: 140px !important;
}

.mw_150 {
  min-width: 150px !important;
}

.mw_200 {
  min-width: 200px !important;
}

.MW_300 {
  max-width: 300px !important;
}

.PKey {
  color: blue !important;
  font-weight: 700;
  font-family: Arial;
}

.Time_Str {
  padding-left: 5px;
  color: darkblue;
}

.tmpCss {
  color: red !important;
}

.Color_OK {
  color: #168652 !important;
}

.Color_Exemption {
  color: #0dcaf0 !important;
}

.Color_Gainsboro {
  color: gainsboro !important;
}

.Color_Incomplete {
  color: orange !important;
}

.Color_Pause {
  color: darkorange !important;
}

.Color_Waiting {
  color: #3498db !important;
}

.Color_Absent {
  color: red !important;
}

.Color_Blue {
  color: blue !important;
}

.Color_DarkBlue {
  color: darkblue !important;
}

.Color_DarkRed {
  color: darkred !important;
}

.Color_Men {
  color: blue !important;
}

.Color_Women {
  color: deeppink !important;
}

.FF_Bien {
  font-family: biensport;
}

.BC_Light1 {
  background-color: #fbfcfe !important;
}

.BC_Light2 {
  background-color: #eff0f8 !important;
}

.BC_Light3 {
  background-color: #c7eaee !important;
}

.BC_PreviewMode1 {
  background-color: yellow;
}

.BC_PreviewMode2 {
  background-color: #00d0ff;
}

.XFC_G1 {
  color: #0e4e3e !important;
}

.XFW_700 {
  font-weight: 700 !important;
}

.XFW_800 {
  font-weight: 800 !important;
}

.XFW_900 {
  font-weight: 900 !important;
}

.FF_Logo {
  font-family: biensport_bold !important;
}

.Numeric {
  font-family: Arial !important;
}

.DivDate {
  direction: ltr;
  display: inline-block;
}
.DivDate span {
  font-family: Arial !important;
}

.TD_Auto {
  width: 1%;
  white-space: nowrap;
}

.Small_Alert .alert {
  padding-top: 8px;
  padding-bottom: 5px;
}
.Small_Alert h5 {
  font-size: 1.1rem;
}

/* #endregion */
/* #region Form_Zone */
.FormTopCard {
  /*background-color: yellow;*/
  width: 100%;
}
.FormTopCard td {
  height: 36px;
  height: 40px;
  border-radius: 5px;
}
.FormTopCard td i {
  font-size: 1.4rem;
}
.FormTopCard .Title {
  /*background-color: yellow;*/
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 5px;
}
.FormTopCard .Td_Close {
  width: 50px;
  text-align: center;
}
.FormTopCard .Td_Close:hover {
  cursor: pointer;
  color: darkred;
}

.modal-dialog {
  margin: 0;
}

.modal-content {
  padding: 1px;
}

.modal-header {
  padding: 0;
  margin: 1px;
  border-bottom: 1px solid #dee2e6;
}
.modal-header .close {
  padding: 5px 10px;
  margin: 0;
}

.AFormWS {
  max-width: 100vw;
}

.AFormHeader {
  padding: 0px 10px;
  width: 100%;
  /*background-color: aqua;*/
}
.AFormHeader td {
  height: 40px;
}
.AFormHeader i {
  font-size: 1.5rem;
}
.AFormHeader .Td_Close {
  width: 50px;
  text-align: center;
}
.AFormHeader .Td_Close:hover {
  cursor: pointer;
  color: darkred;
}
.AFormHeader .FTitle {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  padding-right: 10px;
  font-size: 1.15rem;
}
.AFormHeader .FTitle i {
  padding-left: 10px;
}
.AFormHeader .FTitle i:hover {
  cursor: pointer;
  color: darkred;
}
.AFormHeader .Td_Help {
  /*background-color: yellow;*/
  width: 50px;
  text-align: center;
}
.AFormHeader .Td_Help:hover {
  cursor: pointer;
  color: blue;
}

.AFormExitBtn:hover {
  cursor: pointer;
}

.modal-body {
  padding: 10px;
  min-height: 200px;
  /*background-color:yellow;*/
}
.modal-body .FormBody_Full {
  /*background-color: cyan;*/
  margin-top: 10px;
  height: calc(100vh - 181px);
  overflow: auto;
}
.modal-body .FormBody_Layout {
  /*background-color: chartreuse;*/
  margin-top: 10px;
  height: calc(100vh - 220px);
  overflow: auto;
}

.MsgBoxBody {
  min-height: 120px;
}

.AFormFooter {
  /*background-color: turquoise;*/
  text-align: center;
  margin: 0 2px;
  height: 40px;
  font-size: 1rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.AFormMsg {
  max-width: 90vw;
  margin: 120px auto;
  width: 800px;
  height: calc(100vh - 300px);
}

.AFormS {
  /*background-color: aqua;*/
  max-width: 90vw;
  margin: 40px auto;
  width: 500px;
  height: calc(100vh - 80px);
}

.AFormES {
  max-width: 90vw;
  margin: 40px auto;
  width: 700px;
  height: calc(100vh - 80px);
  /*background-color: aqua;*/
}

.AFormM {
  max-width: 95vw;
  margin: 40px auto;
  width: 1000px;
  height: calc(100vh - 80px);
}

.AFormEM {
  max-width: 95vw;
  margin: 40px auto;
  width: 1300px;
  height: calc(100vh - 80px);
}

.AFormL {
  max-width: 95vw;
  margin: 40px auto;
  width: 1500px;
  height: calc(100vh - 80px);
}

.Form_SmalContainer {
  /*background-color: yellow;*/
  height: calc(100vh - 170px);
  overflow: auto;
}
.Form_SmalContainer .BtnListContainer {
  /*background-color: cyan;*/
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  height: 45px;
  overflow: auto;
}
.Form_SmalContainer .BtnListContainer .Left_Area, .Form_SmalContainer .BtnListContainer .Right_Area {
  min-width: 230px;
  overflow: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.Form_SmalContainer .BtnListContainer .Left_Area {
  /*background-color: orange;*/
  justify-content: flex-start;
}
.Form_SmalContainer .BtnListContainer .Left_Area .TxtBtn, .Form_SmalContainer .BtnListContainer .Left_Area .ImgBtn {
  margin-right: 3px;
}
.Form_SmalContainer .BtnListContainer .Right_Area {
  /*background-color: yellow;*/
  padding-right: 5px;
  justify-content: flex-end;
}
.Form_SmalContainer .BtnListContainer .Right_Area .TxtBtn, .Form_SmalContainer .BtnListContainer .Right_Area .ImgBtn {
  margin-left: 3px;
}
.Form_SmalContainer .Card_DayProg .Werd_Elm {
  /*font-size: 1.5rem;*/
  font-size: 1.3rem;
  margin-top: 0.5rem;
}
.Form_SmalContainer .Card_DayProg .Werd_Elm .JH_Nbr {
  /*font-size: 1.5rem;*/
  font-size: 1.3rem;
}
.Form_SmalContainer .Card_DayProg .Werd_Elm .Div_Obj {
  /*margin-top: 1rem;*/
}
.Form_SmalContainer .Home_WerdList {
  /*height: calc(100vh - 270px);*/
  /*background-color: yellow;*/
  height: 10rem;
}
.Form_SmalContainer .Home_WerdList .Werd_Name {
  font-size: 1.1rem;
  width: 100%;
  margin: 0 auto;
  padding: 5px;
}

.Form_Container {
  /*background-color: yellow;*/
  height: calc(100vh - 160px);
  overflow: auto;
}
.Form_Container .AddRem_Container_000 {
  /*background-color: cyan;*/
  width: 100%;
}
.Form_Container .AddRem_Container_000 td:nth-child(1) {
  width: 1%;
  white-space: nowrap;
}
.Form_Container .AddRem_Container_000 td:nth-child(3) {
  width: 1%;
  white-space: nowrap;
}
.Form_Container .Layout_SubHeader {
  /*background-color: yellow;*/
  width: 100%;
  margin-bottom: 5px;
}
.Form_Container .Layout_SubHeader i {
  font-size: 1.4rem;
}
.Form_Container .Layout_SubHeader .Title {
  /*padding-left: 5px;*/
  font-weight: 700;
}
.Form_Container .Internal_Body_1Z {
  /*background-color: lime;*/
  height: calc(100vh - 160px);
  overflow: auto;
}
.Form_Container .Internal_Body_2Z {
  /*background-color: yellow;*/
  margin-top: 5px;
  height: calc(100vh - 163px);
  overflow: auto;
  padding-top: 5px;
}
.Form_Container .BtnListContainer {
  background-color: orange;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  /*height: 45px;*/
  overflow: auto;
}
.Form_Container .BtnListContainer .Left_Area, .Form_Container .BtnListContainer .Right_Area {
  min-width: 300px;
  overflow: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.Form_Container .BtnListContainer .Left_Area {
  /*background-color: orange;*/
  justify-content: flex-start;
}
.Form_Container .BtnListContainer .Left_Area .TxtBtn, .Form_Container .BtnListContainer .Left_Area .ImgBtn {
  margin-right: 3px;
}
.Form_Container .BtnListContainer .Right_Area {
  /*background-color: yellow;*/
  padding-right: 5px;
  justify-content: flex-end;
}
.Form_Container .BtnListContainer .Right_Area .TxtBtn, .Form_Container .BtnListContainer .Right_Area .ImgBtn {
  margin-left: 3px;
}
.Form_Container .TableContainer {
  height: 100%;
  /*overflow: auto;*/
}
.Form_Container .TableContainer h1, .Form_Container .TableContainer h2, .Form_Container .TableContainer h3, .Form_Container .TableContainer h4, .Form_Container .TableContainer P {
  font-size: 16px;
  font-weight: normal;
  display: inline-block;
  margin: 0;
}
.Form_Container .Floating_Btn .OpenPanel_Trigger:disabled {
  background-color: white;
}
.Form_Container .Floating_Btn .OpenPanel_Trigger:hover {
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  cursor: pointer;
}
.Form_Container .Floating_Btn .OpenPanel_Trigger:active {
  box-shadow: none;
}

.Form_Footer {
  /*background-color: turquoise;*/
  text-align: center;
  height: 35px;
}
.Form_Footer h6 {
  margin: 0;
}

.LiteForm {
  width: 100vw;
  height: 100vh;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(196, 208, 255, 0.05);
}
.LiteForm .LFormWS {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.LiteForm .LFormWS .LFormHeader {
  width: 100%;
  margin-bottom: 5px;
  /*background-color: orange !important;*/
}
.LiteForm .LFormWS .LFormHeader td:nth-child(1) {
  /*width: 500px;*/
}
.LiteForm .LFormWS .LFormHeader td:nth-child(2) {
  /*width: 60px;*/
}
.LiteForm .LFormWS .LFormHeader td .DBtn {
  width: 100%;
}
.LiteForm .LFormWS .LFormContainer {
  background-color: white;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  position: absolute;
  top: 10px;
  z-index: 2000;
  max-width: 95vw;
  width: 800px;
}
.LiteForm .LFormWS .LFormContainer .LFormBody {
  /*background-color: greenyellow;*/
  width: 100%;
  max-width: 95vw;
  height: calc(100vh - 100px);
  overflow: auto;
}
.LiteForm .LFormWS .LFormContainer .LFormBody .LF_MainDiv {
  /*background-color: yellow;*/
  height: calc(100vh - 260px);
  overflow: auto;
}
.LiteForm .LFormWS .LFormContainer .MSP_LFormBody {
  /*background-color: greenyellow;*/
  width: 100%;
  max-width: 95vw;
  height: calc(100vh - 70px);
  overflow: auto;
  border-radius: 5px;
}
.LiteForm .LFormWS .LForm_Footer {
  /*background-color: turquoise;*/
  text-align: center;
}
.LiteForm .LFormWS .LForm_Footer .MsgDiv {
  height: 35px;
  padding-top: 7px;
}
.LiteForm .LFormWS .BtnCard {
  margin-top: 10px;
  width: 100%;
}
.LiteForm .LFormWS .BtnCard .DBtn {
  width: 100%;
}

.LF_Hidden {
  display: none;
}

.DialogueBox {
  width: 100vw;
  height: 100vh;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(196, 208, 255, 0.05);
  /*background-color: yellow;*/
  z-index: 4000;
}
.DialogueBox .DialogueContainer {
  /*background-color: yellow;*/
  background-color: white;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  max-width: 90vw;
  margin: 30vh auto;
  width: 700px;
}
.DialogueBox .DialogueContainer .DialogueBody {
  /*height: 200px;*/
  /*background-color: #f7fbfe;*/
  min-height: 200px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.DialogueBox .DialogueContainer .DialogueBody .alert {
  width: 100%;
}
.DialogueBox .DialogueContainer .DialogueBody .btn-danger:hover {
  color: white;
}

.PanelBox {
  width: 100vw;
  height: 100vh;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(196, 208, 255, 0.05);
  z-index: 3000;
}
.PanelBox .alert {
  width: 100%;
}
.PanelBox .PanelContainer_S {
  /*background-color: yellow;*/
  background-color: white;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  margin: 40px auto;
  width: 400px;
  max-width: 95vw;
  height: calc(100vh - 80px);
}
.PanelBox .PanelContainer_S .PanelBody {
  /*background-color: cyan;*/
  min-height: 200px;
  height: calc(100vh - 130px);
  overflow: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.PanelBox .PanelContainer_M {
  /*background-color: yellow;*/
  background-color: white;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  margin: 40px auto;
  width: 600px;
  max-width: 95vw;
  height: calc(100vh - 80px);
}
.PanelBox .PanelContainer_M .PanelBody {
  /*background-color: cyan;*/
  min-height: 200px;
  height: calc(100vh - 130px);
  overflow: auto;
  padding: 10px 10px 0 10px;
}
.PanelBox .PanelContainer_M .PanelBody .HMR_Container {
  /*background-color: orange;*/
  height: calc(100vh - 200px);
  overflow: auto;
  margin-top: 10px;
}

.Flex_Center {
  /*background-color: yellow;*/
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 5px;
  overflow: auto;
}

/* #endregion */
/* #region Btn_Zone */
.LBtn {
  font-weight: 800;
  font-size: 1.5rem;
  /*letter-spacing: 1px;*/
  display: inline-block;
  padding: 10px 30px;
  border-radius: 50px;
  transition: 0.5s;
  color: #0e4e3e;
  border: 4px solid #0e4e3e;
  font-family: Almarai;
}
.LBtn:hover {
  background: #0e4e3e;
  color: #fff;
  cursor: pointer;
}

.MBtn {
  font-weight: 600;
  font-size: 1.2rem;
  letter-spacing: 1px;
  display: inline-block;
  padding: 10px 30px;
  border-radius: 50px;
  transition: 0.5s;
  color: #0e4e3e;
  border: 2px solid #0e4e3e;
  font-family: Almarai;
}
.MBtn:hover {
  background: #0e4e3e;
  color: #fff;
  cursor: pointer;
}

.Btn {
  font-family: Almarai;
  font-size: 1.2rem;
  text-align: center;
  display: inline-block;
  padding: 8px 20px 10px 20px;
  border-radius: 0.25rem;
  /*transition: 0.5s;*/
  border: 1px solid rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.8);
  height: 50px;
  min-width: 150px;
}
.Btn:hover {
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  color: rgb(0, 0, 0);
  cursor: pointer;
}

.TxtBtn {
  display: inline-block;
  text-align: center;
  border: 1px solid #CCC;
  border-radius: 4px;
  min-width: 100px;
  font-size: 1.2rem;
  padding: 5px 10pX;
}
.TxtBtn:hover {
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  color: rgb(0, 0, 0);
  cursor: pointer;
}
.TxtBtn:active {
  color: black;
  font-size: 1.19rem;
  box-shadow: none;
}

.STxtBtn {
  font-size: 1rem !important;
  padding: 2px 5pX;
}

.ImgBtn {
  display: inline-block;
  text-align: center;
  border: 1px solid #CCC;
  border-radius: 4px;
  /*font-size: 2.2rem;*/
  font-size: 2rem;
  padding: 5px 10pX;
  min-width: 120px !important;
  /*width: 100px;*/
}
.ImgBtn:hover {
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  color: rgb(0, 0, 0);
  cursor: pointer;
}
.ImgBtn:active {
  color: black;
  font-size: 1.9rem;
  box-shadow: none;
}

.BtnBody {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 40px;
}

/* #endregion */
/* #region DataList_Zone */
.Selected {
  background-color: #9dd0ed !important;
}

.TR_Pointer tr:hover {
  cursor: pointer;
  background-color: #f6f9ff;
}

.TR_BorderBottom tr td {
  border-bottom: 0.2px solid Gainsboro;
}

.DL_ROW {
  width: 100%;
}
.DL_ROW tr td {
  height: 40px !important;
  border-bottom: 0.2px solid Gainsboro;
}
.DL_ROW tr:hover {
  cursor: pointer;
  background-color: #f6f9ff;
}

.DataList {
  width: 100%;
  font-family: Almarai;
}
.DataList th, .DataList td {
  text-align: right;
}
.DataList th:nth-child(1), .DataList td:nth-child(1) {
  display: none;
}
.DataList tr:not(:nth-child(1)):hover {
  cursor: pointer;
  background-color: #f6f9ff;
  /*color: black;*/
}
.DataList th {
  position: sticky;
  top: 0px;
  height: 40px;
  background-color: #d7e2f0;
  padding: 0 10px;
  border-bottom: 2px solid white;
  font-weight: normal;
  /* &:last-child {
      width: 80px;
      text-align: center;
  }*/
}
.DataList td {
  height: 35px;
  padding: 0 10px;
  border-bottom: 0.2px solid Gainsboro;
  /*&:last-child {
      text-align: center;
      font-family: Arial;
  }*/
}
.DataList .Count_Cell {
  padding: 0;
  text-align: left;
}
.DataList .Count_Cell div {
  width: 80px;
  height: 40px;
  /*font-family: Arial;*/
  background-color: #9ec5fe;
  /* display: inline-block;*/
  text-align: center;
  /*padding: 10px 0;*/
}
.DataList .Last_TH {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: center;
  height: 40px;
}
.DataList .Last_TH div {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #9ec5fe;
}
.DataList .Last_TH div:hover {
  cursor: pointer;
}
.DataList .Last_TH .Count_Div {
  width: 50px;
  /*font-family: Arial;*/
  align-items: end;
}
.DataList .Last_TH .Btn_Div {
  width: 30px;
  align-items: center;
}
.DataList .BtnTH, .DataList .BtnTD {
  text-align: center;
  font-size: 22px;
}
.DataList .BtnTH:hover, .DataList .BtnTD:hover {
  cursor: pointer;
  background-color: #9ec5fe;
}
.DataList .List_Count {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.DataList .List_StnBtn {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
}
.DataList .List_StnBtn .Stn_Icon {
  font-size: 22px;
}
.DataList .List_StnBtn:hover {
  cursor: pointer;
}
.DataList .row {
  --bs-gutter-x: 0;
}

.DL_CountHdr {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.DL_CountHdr div:nth-child(1) {
  /*span {
      display: inline-block;

      &:nth-child(1) {
          width: 50px;
      }
  }*/
}
.DL_CountHdr div:nth-child(2) {
  color: darkblue;
  font-weight: bold;
}
.DL_CountHdr div:nth-child(2) span {
  font-family: Arial;
}

.DataList_NoHover {
  width: 100%;
  font-family: Almarai;
}
.DataList_NoHover th:nth-child(1), .DataList_NoHover td:nth-child(1) {
  display: none;
}
.DataList_NoHover th {
  height: 40px;
  background-color: #d7e2f0;
  padding: 0 10px;
  border-bottom: 2px solid white;
  font-weight: normal;
  /* &:last-child {
      width: 80px;
      text-align: center;
  }*/
}
.DataList_NoHover td {
  height: 35px;
  padding: 0 10px;
  border-bottom: 0.2px solid Gainsboro;
  /* &:last-child {
      text-align: center;
  }*/
}
.DataList_NoHover .Count_Cell {
  padding: 0;
  text-align: left;
}
.DataList_NoHover .Count_Cell div {
  width: 80px;
  height: 40px;
  background-color: #9ec5fe;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.DataList_Msg {
  width: 100%;
  font-family: Almarai;
  /*margin-bottom: 1rem;*/
}
.DataList_Msg th {
  height: 40px;
  background-color: #d7e2f0;
  padding: 0 10px;
  border-bottom: 2px solid white;
  font-weight: normal;
}
.DataList_Msg td {
  height: 35px;
  padding: 0 10px;
  /*border-bottom: 0.2px solid Gainsboro;*/
}

.Row_2Col_RL {
  /*background-color: yellow;*/
  width: 100%;
  padding: 7px 0;
}
.Row_2Col_RL i {
  margin-left: 10px;
  font-size: 1.2rem;
}
.Row_2Col_RL .RDiv .Flag {
  margin-right: 15px;
}
.Row_2Col_RL .LDiv {
  text-align: left;
  /* i {
      margin-left: 10px;
      font-size: 1.2rem;
  }*/
  padding: 0;
}
.Row_2Col_RL span {
  display: inline-block;
}

.EmptyDReg td {
  font-size: 0.9rem;
  color: #8e8e8e;
}

.DL_MoshafPanel td {
  text-align: center;
}

.DL_2Col td:nth-child(2) {
  min-width: 300px;
}
.DL_2Col td:nth-child(3) {
  min-width: 150px;
  width: 150px;
}

.DL_QDAY td:nth-child(2) {
  width: 120px;
}
.DL_QDAY td:nth-child(3) {
  font-family: Arial;
  width: 70px;
  width: 50px;
}
.DL_QDAY td:nth-child(4) {
  padding-top: 2px;
}
.DL_QDAY td:nth-child(4) i {
  font-size: 1.4rem;
  margin: 0 2px;
}
.DL_QDAY td:nth-child(4) .QDay_Plan {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.DL_QDAY .RowStatus_DayOff {
  background-color: #eaf1ee;
}

.DL_XDOS td:nth-child(2) {
  font-family: Arial;
  width: 80px;
}
.DL_XDOS td:nth-child(3) {
  /*width: 50px;*/
}
.GPrm_Card {
  width: 100%;
}
.GPrm_Card td {
  /*height: 35px;
  padding: 0 10px;*/
  /*border-bottom: 0.2px solid Gainsboro;*/
}
.GPrm_Card td:nth-child(2) {
  /*min-width: 300px;*/
}
.GPrm_Card td:nth-child(3) {
  /*min-width: 150px;
  width: 150px;*/
}
.GPrm_Card .Cell_Scope div {
  margin: 5px 0;
}
.GPrm_Card .Cell_Scope div:nth-child(2) {
  font-size: 0.8rem;
}
.GPrm_Card .Cell_Prm i {
  font-size: 1.4rem;
}

/* #endregion */
@media (min-width: 300px) {
  .WebApp .container {
    max-width: 100vw;
  }
  .LayoutM .LayoutBody {
    width: 100%;
  }
  .BtnListContainer .Right_Area {
    text-align: right;
  }
  .BtnListContainer .Left_Area {
    text-align: left;
  }
  .Small_Txt1 {
    font-size: 0.8rem;
  }
  .Small_Txt2 {
    font-size: 0.7rem;
  }
}
@media (min-width: 500px) {
  .Small_Txt1 {
    font-size: 1.2rem;
  }
  .Small_Txt2 {
    font-size: 1rem;
  }
}
@media (max-width: 500px) {
  .section-title h2:before, .section-title h2:after {
    display: none !important;
  }
  .AppXCard {
    /*background-color:yellow;*/
    border-spacing: 1px 0 !important;
  }
  .AppXCard .UserCard {
    /*background-color: yellow;*/
    width: 50px !important;
    justify-content: flex-end !important;
  }
  .AppXCard .MenuCard {
    /*background-color: yellow;*/
    width: 45px !important;
    text-align: left !important;
  }
  .DPicker_Card .Day_Name {
    font-size: 0.8rem !important;
  }
}
@media (min-width: 601px) {
  .WebApp .container {
    max-width: 98vw;
  }
}
@media (max-width: 990px) {
  .XFS_1 {
    font-size: 0.5rem !important;
  }
  .XFS_2 {
    font-size: 1rem !important;
  }
  .XFS_3 {
    font-size: 2rem !important;
  }
  .XFS_4 {
    font-size: 3rem !important;
  }
  .Page_Reception {
    margin-top: 30px;
  }
  .Page_Reception .animated {
    animation: none;
  }
  .Page_Reception .LDiv .BtnDiv {
    margin-bottom: 3rem;
  }
  .Page_Reception .LDiv .BtnDiv .LBtn {
    font-weight: 600;
    font-size: 1.2rem;
    padding: 10px 20px;
  }
  .Page_Reception .LDiv form {
    margin: 0 auto;
  }
  .Page_Reception .InfoDiv {
    margin-bottom: 3rem;
  }
  .Page_Reception .InfoDiv h2 {
    margin: 0 auto;
  }
  .SmallOnly {
    display: block;
  }
  .BigOnly {
    display: none;
  }
  .PortalName .SpaceName {
    display: none;
  }
}
@media (min-width: 991px) {
  .XFS_1 {
    font-size: 1rem !important;
  }
  .XFS_2 {
    font-size: 2rem !important;
  }
  .XFS_3 {
    font-size: 3rem !important;
  }
  .XFS_4 {
    font-size: 4rem !important;
  }
  .Page_Reception {
    margin-top: 50px;
  }
  .Page_Reception .animated {
    animation: up-down 2s ease-in-out infinite alternate-reverse both;
  }
  .SmallOnly {
    display: none;
  }
  .BigOnly {
    display: block;
  }
  .PortalName .SpaceName {
    display: inline-block;
  }
  .LayoutM .LayoutBody {
    width: 80%;
  }
  .BtnListContainer .Right_Area {
    text-align: left;
  }
  .BtnListContainer .Left_Area {
    text-align: right;
  }
  /*.WebApp {
      .container {
          max-width: 100vw;
      }
  }*/
}