@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200;500;600&family=Tajawal:wght@200;300;700&display=swap');
 body {
  background-color: #f2f3f5 !important;

}

.main{margin-bottom: 100px; padding-bottom: 100px;}
.nav-link{padding: 0px !important;}
a,
button {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  cursor: pointer;
  border: none;
  outline: none;
  background: none;
  text-decoration: none;
}

img,
video {
  display: block;
  /* max-width: 100%; */
  /* height: auto; */
  -o-object-fit: cover;
     object-fit: cover;
}

.container {
  max-width: 80rem;
  width: 100%;
  height: auto;
  padding: 0 2rem;
  margin: 0 auto;
}

.text {
  font-family: inherit;
  font-weight: 700;
  line-height: inherit;
  text-rendering: optimizeLegibility;
}
.text-title {
  font-size:14px ;
  color: #313030;
}
.imageproduct{margin-left: -2px;}
.imageproduct img{border-radius: 5px;margin-left: -8px;}
.paragraph {
  font-family: inherit;
  font-size: 1rem;
  font-weight: normal;
  line-height: inherit;
  margin: 0.25rem 0;
  color: #252a32;
  text-transform: unset;
  text-rendering: optimizeLegibility;
}

.truncate {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  max-width: 100%;
  height: auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main .scroll {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  height: auto;
  padding: 1rem 0;
  margin: 2.5rem 0;
  cursor: default;
  overflow: scroll hidden;
  -ms-scroll-snap-type: x mandatory;
      scroll-snap-type: x mandatory;
  scroll-padding: 0px 1.25rem;
  scrollbar-width: none;
}


.main .scroll::-webkit-scrollbar {
  display: none;
}
.main .scroll.active {
  /* cursor: grab; */
  cursor: -webkit-grab;
}
.main .scroll .card {
  width:  100px;
  /* height: auto; */
  flex: 0 0 auto;
  margin: 0 5px;
  border: none;
  outline: none;
  border-radius: 0.25rem;
  color: #252a32;
  background: #ffffff;
  /* box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); */
}
.main .scroll .card-image {
  position: relative;
  display: block;
  width: 100%;
  height: 50px;
  padding-top: 50%;
}
.main .scroll .card-image img.responsive {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

a{color: #000 !important;text-decoration: none !important;}
a:hover{color: #000 !important}

.ml-3{margin-left: 10px !important;}


.text-wrap{text-wrap:wrap !important; flex-wrap: wrap!important;}
.card
{
  max-height:130px ; 
  overflow:hidden;
}
.card p{max-height:50px ; overflow: hidden;}
.imglogo{height: 100px;width: 100px !important; margin: auto; border-radius: 50%;}

.footer-social-icons a{margin-right: 8px;}

footer{ color: #ffffff; margin-bottom: -2px ;padding: 3px 0; text-align: center;width: 100%;position: fixed;bottom: 0px; margin-top: 200px;}
footer .btn{
  border-radius: 0px !important;
  background-color: #f2f3f5;
  font-size: 13px;

}
.navbar-dark a{color: #ffffff !important;}
.cardcategories{
  position: fixed;
  top: 7;
  z-index: 111111;
  position: fixed;

}

h1,h2,h3,h4,h5,h6,p,span,a,p{
  font-family: 'Tajawal', sans-serif;
}


.border-right-0{border-right: 0px !important;}

.cardTex{
  margin-top: -39px;
  border: 1px solid #ef8484;
  border-radius: 5px;
  text-align: center;
  padding: 10px 0;
  background-color: #f477770d;
  }
.btn:hover{
  color: #f2f3f5 !important;

}
  .btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
    background-color: #42424229 !important;
}