@font-face {
  font-family: Almarai;
  src: url(../fonts/Almarai-Regular.ttf) format("truetype"); }

@font-face {
  font-family: biensport_light;
  src: url(../fonts/biensport_light.ttf) format("truetype"); }

body {
  margin: 0;
  padding: 0;
  font-family: Almarai; }

.validation-summary-errors {
  color: #e80c4d; }

.validation-summary-errors ul {
  list-style-type: none;
  padding: 5px 0 !important; }

.abtn {
  color: #343a40;
  border-color: #cccccc; }

.abtn:hover {
  color: #333333;
  background-color: #ebebeb;
  border-color: #adadad; }

.abtn.disabled, .abtn:disabled {
  color: #343a40;
  background-color: transparent; }

.abtn:not(:disabled):not(.disabled):active, .abtn:not(:disabled):not(.disabled).active,
.show > .abtn.dropdown-toggle {
  color: #333333;
  background-color: #D8D8D8;
  border-color: #adadad; }

.ImgBtn {
  display: inline-block;
  border: 1px solid #CCC;
  border-radius: 4px;
  height: 38px;
  text-align: center;
  padding-top: 6px; }
  .ImgBtn img {
    width: 25px;
    height: 25px; }
  .ImgBtn:hover {
    cursor: pointer;
    background-color: #ebebeb;
    border-color: #adadad; }

.btnHome {
  width: 60px;
  top: 4px;
  right: 4px;
  position: fixed;
  z-index: 999;
  background-color: white; }

.HelpContainer {
  width: 100%;
  direction: rtl; }
  .HelpContainer td {
    text-align: center; }
  .HelpContainer h4 {
    font-weight: bold;
    color: darkgreen;
    margin-bottom: 15px; }

.ErrorCard {
  width: 100vw; }
  .ErrorCard td {
    text-align: center;
    padding-top: 20vh; }

.Div_Body {
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  align-items: center; }

.LoginForm {
  width: 100%;
  direction: rtl; }

.form-input {
  border: none;
  border-radius: 0;
  margin: 5px 0;
  box-shadow: 0 1px 0 0 #e5e5e5; }

.Div_Btn {
  display: flex;
  width: 100%;
  justify-content: space-between;
  margin-top: 20px;
  direction: rtl; }
  .Div_Btn .btnLogin1 {
    width: 48%; }
  .Div_Btn .btnLogin2 {
    width: 48%; }

.btnPageFB {
  width: 200px;
  margin-right: -2vw;
  position: absolute;
  top: 82vh;
  direction: rtl;
  display: none; }
  .btnPageFB:hover {
    cursor: pointer; }

@media screen and (min-height: 200px) and (max-height: 315px) {
  .Div_Logo1 {
    display: none !important; }
  .Div_Logo2 {
    height: 20vh !important; }
    .Div_Logo2 img:nth-child(1) {
      display: none; } }

@media screen and (orientation: portrait) {
  .Div_Logo1 {
    display: none; }
  .Div_Login {
    display: flex;
    flex-direction: column;
    height: 100vh;
    width: 100vw; }
    .Div_Login .Div_Content {
      width: 100%;
      height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center; }
      .Div_Login .Div_Content .Div_LoginCard {
        width: 230px;
        margin-top: 5vh; }
      .Div_Login .Div_Content .Div_Name {
        display: none; }
      .Div_Login .Div_Content .Div_Logo2 {
        background-color: #F3F4ED;
        height: 50vh;
        width: 100vw;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center; }
        .Div_Login .Div_Content .Div_Logo2 img:nth-child(1) {
          height: 30vh;
          width: auto;
          max-width: 95vw; }
        .Div_Login .Div_Content .Div_Logo2 img:nth-child(2) {
          height: 10vh;
          width: auto;
          max-width: 95vw; }
  .btnPageFB {
    position: static;
    margin-top: 10px;
    margin-right: 0; } }

@media screen and (orientation: landscape) {
  .Div_Logo1 {
    background-color: #F3F4ED;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    height: 100vh;
    width: 30vw; }
    .Div_Logo1 img {
      height: 50%;
      width: auto;
      max-width: 25vw;
      margin-bottom: 20vh; }
  .Div_Logo2 {
    display: none; }
  .Div_Login {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    height: 100vh;
    width: 70vw; }
    .Div_Login .Div_Content {
      width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      align-items: flex-end;
      padding-right: 2vw;
      margin-bottom: 16vh; }
      .Div_Login .Div_Content .Div_LoginCard {
        width: 250px; }
      .Div_Login .Div_Content .Div_Name {
        margin-top: 10vh;
        margin-right: -2vw;
        display: flex;
        flex-direction: row-reverse;
        justify-content: flex-start;
        align-items: flex-end; }
        .Div_Login .Div_Content .Div_Name .jim_name {
          height: 15vh;
          width: auto;
          max-width: 65vw; } }

.modal-dialog {
  margin: 0; }

.modal-header {
  padding: 0;
  margin: 0; }
  .modal-header .close {
    padding: 5px 10px;
    margin: 0; }

.modal_FormM {
  max-width: 300px;
  margin: 40px auto; }

/**/
.FormHeader {
  padding: 3px 10px; }
  .FormHeader table {
    direction: rtl;
    width: 100%; }
    .FormHeader table td .MsgBox_Title {
      font-size: 18px; }
    .FormHeader table td:nth-child(1) {
      text-align: right; }
    .FormHeader table td:nth-child(2) {
      width: 40px; }
  .FormHeader .close {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; }

.FormBody {
  padding: 10px 15px; }

.FormFooter {
  text-align: right;
  padding: 10px 10px; }

.AppMsgBox_Msg {
  font-size: 20px; }