@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;700;800&display=swap');

*{
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
    cursor: red;
}
body{
    width: 100%;
    font-family: 'Almarai', sans-serif;
    color: #fffefe;
    
}
ul{
  padding: 0px;
  margin: 0px;
}
ul li{
  list-style-type: none; 
}

  
.navbar-brand{
    font-family: 'Almarai', sans-serif;
    font-weight: 900;
    font-size: 31px;
}
.custom-cursor {
  width: 30px;
  height: 30px;
  border: 1px solid black;
  border-radius: 50%;
  position: absolute;
  pointer-events: none;
}
/* font-family: 'Almarai', sans-serif; */
.card {
  
    background-color: #ffffff26;
    transition: background-color 0.3s, color 0.3s;
    cursor: pointer;
    border: none !important;
    border-radius: 13px;
    font-family: 'Almarai', sans-serif;
    direction: rtl;
    padding: 1rem;
    margin-bottom: 23px;
  }
  .card h3, .card p,span {
    color: #ffffff;
  }
  .card .about_card_title {
    color: #ffffff;
  }
  .card i {
    color: #fff;
    font-size: 31px;
  }
  .card-content {
    padding: 20px;
  }
  
  .card:hover {
    background-color: #ffffff;
  }
  
  
  .card:hover h3,.card:hover span,  .card:hover p {
    color: #030202;
  }
 .donthover:hover span{
    color: #ace340;
  }
  .card:hover i{
    color: #ace340;
  }
  .card:hover h1{
    color: #ace340;
  }
  .donthover:hover {
    background: #ffffff26 !important;
   
  }
  .donthover:hover i {
    color: #ffffff !important;
   
  }

  /* {{NavBar ===================================}} */
.navbar{
  padding: 15px 0px !important;
}
.navbar > .nav__content{

    padding-right: 0px;
    padding-left: 0px;
}
a.navbar-brand {
  margin-right: 0px;
}
.navbar-dark .navbar-brand:hover {
  color: #ace340;
}


  ul.navbar-nav.ms-auto li{
    font-weight: 500;
    color: #fff !important;
}
.navbar-dark .navbar-nav .nav-link {
  color: #fff;
  font-weight: 900 !important;
}
.navbar-dark .navbar-nav .nav-link:hover {
  color: #ace340;
}

  button.btn.btn-light {
    font-weight: 500;
    color: #3924ef !important;
   /*  margin: 0px 5px; */
    border: none;
}
  button.btn.btn-light.ar__btn {
    border-top-right-radius: 11px;
    border-bottom-right-radius: 10px;

    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
  button.btn.btn-light.ar__btn a{
  text-decoration: none;
  color: #3924ef !important;
}
  button.btn.btn-light.en__btn a{
  text-decoration: none;
  color: #3924ef !important;
}

button.btn.btn-light.ar__btn a:hover {
  background: #ace340;
}
button.btn.btn-light.en__btn a:hover {
  background: #ace340;
}
  
button.btn.btn-light.en__btn:hover,
button.btn.btn-light.ar__btn:hover{
  background: #ace340;
  opacity: 100 !important;
}


  button.btn.btn-light.en__btn {
    margin-right: -4px;
  
    border-top-left-radius: 11px;
    border-bottom-left-radius: 10px;

    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

/*{{ contnent ==================================}}*/
.row_app{
  flex-direction: row-reverse;
  /* align-items: flex-end; */

  align-items: center;
 
  


}
.content_app{
  margin-top: 32px;
}
/* {{  close content ==========================================}}*/

/* {{  right content ==========================================}}*/

.right_content {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
 /*  width: 46%; */
}
.right_content .connection{
  margin: 20px 0px;
  color: #fff;
    display: flex;
    align-items: center;
}


ul.list-unstyled.categories li a {
  color: #eee;
  text-decoration: none;
}


.right_content .title {
  color: #fff;
  font-family: 'Almarai', sans-serif;
  font-weight: 900;
  direction: rtl;
}

.right_content .title > span {
 color: #ace340;
}

span.online {
  background: #ace340;
  width: 8px;
  margin: 0px 5px;
  height: 8px;
  display: block;
  border-radius: 9px;
}
/* {{ Close right content ==========================================}}*/
/* {{  left content ==========================================}}*/
.left_content {
  /*   width: 30%; */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    direction: rtl;
}

span.left__info {
  color: #ffffff;
  font-size: smaller;
  font-family: 'Almarai', sans-serif;
}

button.btn.btn-outline-success.left_content-btn {
  padding: 10px 30px;
  margin-top: 16px;
  border-radius: 23px;
}
button.btn.btn-outline-success.left_content-btn:hover {
  color: #000;
}
/* {{ Close left content ==========================================}}*/
/* {{ start slider ==========================================}}*/
.card__content{
  font-size: 21px;
  color: #ffffff;
}

.carousel-indicators [data-bs-target] {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 9px;
  height: 9px;
  padding: 0;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #ace340;
  background-clip: padding-box;
  border: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
 /*  opacity: .5;
  transition: opacity .6s ea; */
  border-radius: 100%;
}

/* {{ Close slider ==========================================}}*/


/* {{ start pages styles ==========================================}}*/
/* 1 - contact_us */
.social_midea ul a li {
  padding: 0px 5px;
}
.social_midea ul a li i {
  font-size: 22px;
}
.social_midea ul a li i:hover {
  color: #ace340 !important;
}
.form-control{
  background: transparent;
}
.lanker_none{
  color: #fff;
    text-decoration: none;
}
.custom-file-upload {
  display: inline-block;
  padding: 8px 12px;
  cursor: pointer;
  font-size: 18px;
  font-weight: bold;
  border: dashed #eee;
  border-radius: 15px;
  padding: 4rem 2rem;
  width: 100%;
 /*  border-radius: 5px; */
  background-color: transparent;
}

.input-file {
  display: none;
}
/* {{ Close pages ==========================================}}*/





























/* {{ footer ==========================================}}*/

.footer{

    color: #ffffff;
    font-family: 'Almarai', sans-serif;
    text-align: center;
    /* font-size: smaller; */
}
/* {{ Close footer ==========================================}}*/





































/* {{ media query ==========================================}}*/



/* for sm */
@media screen and (max-width:678px) {
  body{
    background-size: 100% 100% !important;
  }
  ::-webkit-scrollbar {
    opacity: 0;
  }

  ::-webkit-scrollbar-thumb {
    background-color: transparent;
  }
  
  .carousel-indicators {
    position: absolute;
    right: 0;
    top: -6%;
    height: 16px;
    left: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-right: 15%;
    margin-bottom: 1rem;
    margin-left: 15%;
    list-style: none;
  }
}  

/* lg query */
@media screen and (min-width:678px) {
  /* nav app */

  .carousel-indicators {
    position: absolute;
    right: 0;
    top: -14%;
    height: 16px;
    left: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-right: 15%;
    margin-bottom: 1rem;
    margin-left: 15%;
    list-style: none;
  }

  ul.navbar-nav.ms-auto {
    margin-right: 99px;
}
ul.navbar-nav.ms-auto li {
  padding: 0px 24px;
}
.lang_app {
  margin: 0px 16px;
}

}
/*{{ bootstrap code ==================================}}*/
/* ============ start ================== */
@media screen and (min-width: 992px) {
  .col-lg-5-app {
    flex: 0 0 auto;
    width: 40.666667%;
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.navbar-expand-lg .navbar-nav .nav-link {
  padding: 0px !important;
  margin: 0px !important;
}

  .col-lg-6-app {
    flex: 0 0 auto;
    width: 50%;
    padding-right: 0px !important;
    padding-left: 0px !important;
}
.col-lg-3-app {
  flex: 0 0 auto;
  width: 27%;
}
.col-lg-4-app {
  flex: 0 0 auto;
  width: 29.233336%;
  padding-right: 0px !important;
  padding-left: 0px !important;
  margin-top: 65px;
}

}
/*  */


/* ############################################# */
/* custem scrollbar ============================*/

.lang_app {
    margin-bottom: 20px;
}

/* width */
::-webkit-scrollbar {
  width: 10px;
  opacity: 0;
  display: none;
}

/* Track */
::-webkit-scrollbar-track {
  background: transparent; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #970909; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: transparent; 
}




.form-control {
    background: transparent;
    color: #eee;
}