@font-face {
  font-family: "ExpoArabic";
  src: url("../fonts/Expo\ Arabic\ Medium.ttf");
}
* {
  font-family: "ExpoArabic";
}
body {
  margin-top: 96px;

  background-color: #f6f9ff;
}

body.no-scroll {
  overflow: hidden;
}
.light-blue-bg {
  background-color: #f6f9ff;
}

.textbox {
  background: #fafafa;
  direction: rtl;
}
.faded-color {
  color: #757575;
}

.icon {
  pointer-events: none !important;
}

.secoundery-color {
  color: #40444c;
}
.primary {
  color: #4365de;
}
.primary-bg {
  background: #4365de;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

.active {
  padding: 10px 20px;
  border-radius: 10px;
  background-color: #d9e4fd;
  color: #4365de;
}
.not-active {
  padding: 10px 20px;
  border-radius: 10px;
}
.active-btn {
  background-color: #d9e4fd;
  padding: 1rem 2rem;
  color: #4365de;
  border-radius: 10px;
  font-weight: 400;
}
.not-active-btn {
  padding: 1rem 2rem;
  border-radius: 10px;
  font-weight: 400;
}

.active2 {
  color: white;
  background-color: #4365de;
}

.active3 {
  color: #304cbe;
  border-bottom: #304cbe 4px solid;
}
/* bg-[#708deb52] text-[#304cbe] border border-[#304cbe] */
.active4 {
  border: #304cbe 1px solid;
  color: #304cbe;
  background-color: #708deb52;
}
.active-nav {
  background-color: #d9e4fd;
  color: #4365de;
}


.country-flag {
  border: 1px solid #e0e0e0;
  width: 60%;
  border-radius: 50%;
  height: 60%;
  height: auto;
  object-fit: cover;
}



.main-hero {
  background-size: cover;
  background-position: center;
  background-image : url('../images/pic/hero.jpg');
}

.country-list-flag {
  border-radius: 50%;
  width: 32px;
  height: 32px;
  object-fit: cover;
}

.alert-danger {
  background: #eeaaaa;
  padding: .75rem 2rem;
  margin: 1rem;
  border-radius: 1rem;
  color: #630b0b;
}

.alert-success {
  background: #d9e4fd;
  padding: .75rem 2rem;
  margin: 1rem;
  border-radius: 1rem;
  color: #4365de;
}




ul.pagination {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.form-group{
  display: flex;
  flex-direction: column;
  gap: .5rem;
  margin: 1rem 0px;
  margin-bottom: 2rem;
}

.over-from{
max-width: 33rem;
}

.pr-4 {
  padding-right: 1rem;
}

.pl-4 {
  padding-left: 1rem;
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

button#menu-button {
  position: absolute;
  right: 1rem;
}

.ad-photos-modal{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  z-index: 1000;
  background-color: #f6f9ff;
}

.ad-photos-modal  > div {
  height: 100%;
  width: 100%;
  justify-content: center;
  /* align-items: center; */
}

.z-100 {
  z-index: 100;
}