@font-face {
  font-family: Cairo-Bold;
  src: url('./includes/fonts/cairo/Cairo-Bold.ttf');
}

@font-face {
  font-family: Cairo-Light;
  src: url('./includes/fonts/cairo/Cairo-Light.ttf');
}


@font-face {
  font-family: Tajawal;
  src: url('./includes/fonts/tajawal/Tajawal-Regular.ttf');
}
*{
  direction: ltr; 
}
body{
  background-color: #F0F4FF;
  background-image: url("./images/header-background.svg");
  background-repeat: no-repeat;
  background-position: right top; 
  background-size:  cover;
  touch-action: pan-x pan-y;
}

h1,h2,h3,h4,h5,h6,a.btn,button.btn {
  font-family: Cairo-Bold;

}

h1,h2,h3,h4,h5,h6,.card .card-title{
  color: #393939; 
}

span,label,p,a,li,select{
  color: #646464; 
}

.with-background{
  background-color: #6C07ED;
}

.with-background h1,.with-background h2,.with-background h3,.with-background h4,.with-background h5,
.with-background h6,.with-background span,.with-background label,.with-background p,.with-background a,
.with-background .card-title{
  color: #ffffff; 
}

.pg-echo-system-white h1, .pg-echo-system-white h2,.pg-echo-system-white h3,.pg-echo-system-white h4,.pg-echo-system-white h5,
.pg-echo-system-white h6{
  color: #393939; 
}

.pg-echo-system-white span,.pg-echo-system-white label,.pg-echo-system-white p,.pg-echo-system-white a{
  color: #646464; 
}
.display-table{
  display: table;
}
span,label,p,a {
  font-family: Tajawal;
  font-weight: 400;

}

a{
  text-decoration: none;
}

h1,h3{
  font-weight: 700;
  line-height: normal;
}

h2,h4,h5,h6{
  font-weight: 400;
  line-height: normal;
}

 

.fw-400{
  font-weight: 400;
}

.fw-700{
  font-weight: 700;
}

.fs-1{
  font-size: 48px !important; 
}

.fs-2{
  font-size: 32px !important; 
}

.fs-3{
  font-size: 24px !important; 
}

.fs-4{
  font-size: 20px !important; 
}

.fs-5{
  font-size: 18px !important; 
}

.fs-6,a.btn,button.btn ,.fs-6 *{
  font-size: 16px !important; 
}

.fs-7{ 
  font-size: 14px !important; 
}

.fs-8{ 
  font-size: 12px !important; 
}
/* colors */

.text-primary-60{
  color: #250054 !important;
}

.text-primary-50,.text-primary-50 * {
  color: #6C07ED !important;
}


.text-primary-30{
  color: #834BCA !important;
}

.text-primary-20{
  color: #BC8BFB !important;
}

.text-primary-10{
  color: #E7E7FF !important;
}

.text-primary-5{
  color: #F5F5FF !important;
}

.btn-primary{
  background-color: #6C07ED;
  border-color: #6C07ED !important; 
  border: 2px solid; 
} 

.with-background .btn-primary{
  background-color: transparent;
  border-color: #ffffff !important;
}


.btn-outline-primary{
  border-color: #6C07ED;
  color: #6C07ED;
  background-color: #ffffff;
}

.btn-check:checked+.btn,.btn-check+.btn:hover,
.btn-check:checked+.btn+.btn,.btn-check+.btn:hover+.btn:hover{
  border: 2px solid ;
}

.btn-check+.btn,.btn-check+.btn+.btn{
  border: 0;
  background-color: #EFEFEF;
}

.btn-secondary{
  background-color: #FFFFFF;
  border-color: #FFFFFF;
  color: #646464;
} 

.btn-primary:hover,.btn-primary:active,.btn-primary:active:focus,.btn-primary.active,
.btn-outline-primary:hover,.btn-outline-primary:active,.btn-outline-primary:active:focus,.btn-outline-primary.active,
.btn-secondary:hover,.btn-secondary:active,.btn-secondary:active:focus,.btn-secondary.active,
.btn-check:checked+.btn,.btn-check+.btn:hover,.btn-check:checked+.btn,.btn-check+.btn:hover,
.btn-check:checked+.btn+.btn,.btn-check+.btn:hover+.btn:hover,.btn-check:checked+.btn+.btn,.btn-check+.btn:hover+.btn:hover,
.btn.active,.btn:first-child:active{
  background-color: #E7E7FF;
  border-color: #6C07ED;
  color: #6C07ED;
} 


.btn-primary:hover .text-echo-system-white{
  color: #6C07ED;
}

/*.with-background .btn-primary:hover,.with-background .btn-primary:active,.with-background .btn-primary:active:focus,.with-background .btn-primary.active{
  background-color: #ffffff;
  border-color: #ffffff;
  color: #6C07ED;
}
*/
.text-secondary-red-100{
  color: #AA3C3C;
}

.text-secondary-red-75{
  color: #E36262;
}

.text-secondary-red-50{
  color: #FFA1A1; 
}

.text-secondary-red-25{
  color: #FFCFCF; 
}

.text-echo-system-black-100{
  color: #000000; 
}

.text-echo-system-grey-90{
  color: #393939; 
}
 
.text-echo-system-grey-70{
  color: #646464; 
}
 
.text-echo-system-grey-50{
  color: #989898; 
}

.text-echo-system-grey-30{
  color: #B5B5B5; 
}

.text-echo-system-grey-10{
  color: #E4E4E4; 
}
.text-echo-system-grey-5{
  color: #EFEFEF; 
}

.bg-echo-system-grey-5{
  background-color: #EFEFEF; 
}


.text-echo-system-white,.text-echo-system-white *{
  color: #FFFFFF; 
}

.text-treatery-dark-yellow{
  color: #ED9C1D;
}

.text-treatery-secondary-1{
  color: #FECC0F;
}

.text-treatery-secondary{
  color: #FFF9F0;
}

.text-green-50{
  color: #7FD494;
}
.pg-echo-system-white{
  background-color: #FFFFFF; 
}

.spacer-200{
  display: block;
  height: 200px;
}

.spacer-128{
  display: block;
  height: 128px;
}

.spacer-64{
  display: block;
  height: 64px;
}

.spacer-32{
  display: block;
  height: 32px;
}

.btn.btn-xl{
  width: 270px;
}

.btn.btn-lg{
  width: 245px;
}

.btn.btn-md{
  width: 152px;
}

.btn {
  border: 2px solid;
}


/* header */
 
/* navbar */
nav ul li a.nav-link{
  font-size: 16px !important; 
}

header .profile-img{ 
   position: relative;
   display: inline-block;
}

header .profile-img img{
  height: 48px;
  width: 48px;
   border-radius: 50%; 
   border: 2px solid #6C07ED;
}

/*header .profile-img::after {
  content: url('./images/chevron-down.svg');
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: 1000;
}*/
 
nav{ 
  background-color: rgba(255, 255, 255, .4); 
  backdrop-filter: blur(10px);
}

a.nav-link{
  font-family: Cairo-Light;
}
.navbar-nav a.nav-link{
  font-weight: 600; 
  line-height: normal;
}

.navbar-nav a.nav-link.active,.navbar-nav a.nav-link:hover{
  color: #6C07ED;
}


.dropdown-toggle::after{
  content: url('./images/chevron-down2.svg');
  margin-right: 2px;
  margin-left: 0em;
  vertical-align: -8px;
  border: 0;
}
.advisement{
  padding: 8px 16px; 
  border-radius: 52px;
  background-color: #FECC0F;
}

/* services */

#services .card{
  border-radius: 16px;
  background-color: #E7E7FF;
  border: 0;   
  position: relative;
}

#services .card img{
  max-width: 65%; 
  margin: 0px auto 10px;
}
#services .card-body{
  min-height: 115px;
  display: block;
}
#services .card-title{
  font-size: 20px;
}

.card-body-hover{
  border-radius: 16px;
  background-color: #6C07ED;
  border: 0;
  padding: 0px 5px;
  position: absolute;
  min-height: 100%;
  opacity: 0;
  transition: .3s;
  width: 100%
}
.card-body-hover:hover{
  opacity: 1;
  transition: .2s;
}
.card-body-hover p{ 
  font-family: Cairo-Light;
  font-weight: 400;

}
.service-card .btn{
  border: 2px solid #ffffff;
  font-family: Cairo-Bold;
}


.row-card{
   flex-direction: row;
   border: 0; 
   border-radius: 16px;
}
.row-card img.card-img-top{
  width: 40%;
}
 
.card-transparent{
  background-color: transparent;
}
/* why-tweetcell */

 
/* services-numbers */
#services-numbers a{
  transition: .3s;
}
#services-numbers a:hover{ 
  background-color: #F5F5FF;
  border:1px solid #6C07ED;
  transition: .3s;
}

#services-numbers a div span{
  font-weight: 700;
  opacity: 0;
  transition: .2s;
}

#services-numbers a:hover div span{
  opacity: 1; 
  transition: .2s;
}

#services-numbers .float-end img{
  rotate: 180deg;
}

/* faqs */

#faqs .accordion-item,#faqs .accordion-header,#faqs .accordion-button{
  border-radius: 8px;
  border: 0;
  box-shadow:initial;
}

#faqs .accordion-button:active:focus{
  border: 0; 
}

.accordion-button:not(.collapsed) {
  background-color: #ffffff ;
  color: initial; 
}

/* download-app */
#download-app{
  background-image: url("./images/download-app-background.svg");
  background-repeat: no-repeat;
  background-position: center; 
  background-size:  auto;
}

/* news */

#last-news .card{
  border-radius: 16px;
  transition: .2s;
}

#last-news .card img{
 border-radius: 16px 16px  0 0 ;
}

#last-news .card:hover{
  box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.25);
  transition: .2s;
}

/* footer */
footer{
  border-top: 4px solid #E7E7FF;
}

footer h3{
  border-bottom: 1px solid #B5B5B5;
  margin-left: 30px;
}

footer ul{
  padding: 0;
  list-style-type: none;
}

footer ul li{
  padding-top:  16px;
}

footer ul li a{
  font-family: Cairo-Light;
  font-weight: 600;
  text-decoration: none;
  color: #646464;
}

/* numbers */
#numbers{
  position: relative;
}
#numbers .header-title{
  height: 99px; 
  background-image:    url("./images/numbers-header-bg.svg");
  background-size:     cover;             
  background-repeat:   no-repeat;
  background-position: center center;     
}
#numbers h3{
  font-family: Tajawal;
}

#numbers label.operator{
  border-bottom: 4px solid #6C07ED; 
  width: 100%
}

#numbers .card{
  border-radius: 8px;
  border:0px;
  border-left: 6px solid;  
  border-color:  #ffffff;
  transition: .3s;
  margin-bottom: 10px;
}


#numbers .card .card-title{ 
  font-family: Cairo-Light;
  color: #646464; 
  font-weight: 700;
}

#numbers .card .new-number{
  position: absolute;
  color: #ffffff; 
  background-color: #6C07ED; 
  left: 8px;
  top: 8px;
  border-radius: 8px; 
  padding: 0px 6px;
}
#numbers .card:hover,#numbers .card.special-number:hover,#numbers .card.gold-number:hover{
  border-color:  #6C07ED; 
  background-color: #E7E7FF; 
  transition: .3s;
}
#numbers .card h2{
  white-space: nowrap;
}
#numbers .card h2,#numbers .card .price,#numbers .card .price span{
  transition: .3s;
}
#numbers .card:hover h2{
  color: #6C07ED;
  transition: .3s;
}
#numbers .card:hover .price span{
  color: #fff;
  transition: .3s;
}
#numbers .card:hover .price{
  background-color: #6C07ED;
  transition: .3s;
} 
#numbers .card:hover .price .buy{
  display: inline-block;
}
#numbers .card .price .buy{
  display: none;
}
#numbers .card.special-number{
  border-color:  #6C07ED; 
}

#numbers .card.gold-number{
  border-color:  #FECC0F;
}

#numbers .card.special-number .new-number{
  background-color: #FECC0F;
}

#numbers .card.gold-number .new-number{
  background-color: #6C07ED;
}

#whatsapp-call {
  position: fixed;
  bottom: 15px;
  right: 15px;
  background: #23bf08;
  border-radius: 50%;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.21);
  width: 60px;
  height: 60px;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
} 

#whatsapp-call a {
    font-size: 30px;
    color: #fff;
}

@media (min-width: 1400px){
  .container-sm{
    max-width: 839px !important;
  }

  .container-md{
    max-width: 1058px !important;
  }
}

@media (min-width: 1200px){
  .container-sm{
    max-width: 839px !important;
  }

  .container-md{
    max-width: 1058px !important;
  }
}

/* esim */

#esim .card.package{
  border: 0;
  background-image: url("./images/package-card-background.svg");
  background-repeat: no-repeat;
  background-position: right top; 
  background-size:  cover;
  border-radius: 16px;
}

#esim .card.package ul{
  padding: 0;
  list-style: none;
  font-family: Cairo-Light;
}


.with-background-iamge{
  width: 100%;
  background-color: #6C07ED;
  background-image: url("./images/why-tweetcell-background.svg");
  background-repeat: no-repeat;
  background-position: right top; 
  background-size:  cover;
}
 
#market-search img{ 
  top: 7px;
  right: 10px;
  position: absolute;
  z-index: 1000;
  cursor: pointer;
  border:0;
}



 #market-search input{
  padding: 10px 20px;
}

#market .card.category{
  background-color: #E7E7FF;
  color: #6C07ED;
}

#market .card.category a{
  font-family: Cairo-Bold;
  text-decoration: none;
}

#products .card.product h2{
  font-family: Tajawal;
}

 #products .card.product img.card-img-top{ 
  margin: 0 auto;
}

#products .card.product .card-footer{
  border: 0;
  padding: 0;
  background-color: inherit;
}

#product .card  img.card-img-top{
  max-width: 20%;
  margin: 0 auto;
}

  
#product .product-details div[class^="col"]:nth-of-type(even) {
background-color:#F5F6FF;
}
 

#article p ,#article li{
  font-family: Cairo-Light;
}

#selling-points select{
  background-color: #EFEFEF;
  font-size: 16px;
  border: 0;
  padding: 15px 10px;
  font-family: Tajawal;
}

#selling-points select::after{
  content: url('./images/chevron-down2.svg');
  margin-right: 2px;
  margin-left: 0em;
  vertical-align: -8px;
  border: 0;
}

.with-background a.active:not(.btn)  ,.with-background a:hover:not(.btn){
  color: #FECC0F;
}

.ff-cairo-bold, .ff-cairo-bold *{
  font-family: Cairo-Bold;
}

.ff-vazirmatn, .ff-vazirmatn *{
  font-family: Tajawal;
}

a.active,a:hover{
  color: #6C07ED;
}

#profile-tabs{
  border-color: #6C07ED;
}

#profile-tabs button.nav-link{
  color: #646464;
  font-size: 18px;
  border: 0;
}

#profile-tabs button.nav-link:hover,#profile-tabs button.nav-link.active{
  border-bottom: 5px solid #6C07ED;
  color: #6C07ED;
  background-color: inherit;
  font-weight: 700;
}

#page-2-tabs,#page-3-tabs{
  margin: 0 auto;
}
#page-2-tabs button.nav-link,#page-3-tabs button.nav-link{ 
  margin: 0 auto;
  color:#646464; 
}

#page-2-tabs button.nav-link:hover,#page-2-tabs button.nav-link.active,
#page-3-tabs button.nav-link:hover,#page-3-tabs button.nav-link.active{
  border: 1px solid #6C07ED;
  border-radius: 5px;
  color: #6C07ED;
  background-color: #E7E7FF;
  font-weight: 700;
}

.with-background-profile{
  background-image: url("./images/profile-cover.png");
  background-repeat: no-repeat;
  background-position: center; 
  background-size:  cover;
}

.form-floating label {
  left: 0;
  right: auto;
  padding: 1rem 0.25rem;
}

#products .form-floating label {
  left: auto;
  right: 0;
  padding: 1rem 0.25rem;
}
.form-floating label::after{
  background-color: inherit !important;
}

.form-floating input[type=text],.form-floating input[type=email],.form-floating input[type=password],
.form-floating select,.form-floating textarea{
  border: 0;
  background-color: #FFFFFF;
  border-radius: 8px;
  color: #000;
  font-size: 16px;
}

.card .form-floating input[type=text],.card .form-floating input[type=email],
.card .form-floating input[type=password],.card .form-floating select,.card .form-floating textarea,
.modal .form-floating input[type=text],.modal .form-floating input[type=email],
.modal .form-floating input[type=password],.modal .form-floating select,.modal .form-floating textarea,
.modal textarea{
  background-color: #EFEFEF; 
}

.form-check{
  background-color: #EFEFEF;
  border-radius: 8px;
  font-size: 16px;
  padding: 15px 5px;
}

.form-check .form-check-input{
  border: 2px solid #989898;
  background-color: #EFEFEF;
  padding: 10px; 
}

.form-check-input:checked {
    background-color: #6C07ED;
    border-color: #6C07ED;
}

.form-check .form-check-input:checked {
  border: 2px solid #6C07ED;
  background-color: #6C07ED; 
}

.form-floating textarea.form-control{
  height: auto;
}

.modal .modal-title{
  max-width: 90%;
}

.modal .modal-header{
  background-color: #F5F5FF;
  justify-content: unset;
  display:block;
  position: relative;
}
.modal .btn-close{ 
  margin: auto; 
  left: 15px;
  position: absolute;
  top: 15px;
}
.modal .modal-footer{
  background-color: #F5F5FF; 
  display: unset !important;
}
.table-striped>tbody>tr:nth-of-type(odd)>* {
  --bs-table-bg-type:auto;
  background-color: #F0F4FF;
}

.alert{
  border: 0;
}

.alert-danger{
  background-color: #FFCFCF;
}

.page-item:first-child .page-link{
  border-top-right-radius: var(--bs-pagination-border-radius);
  border-bottom-right-radius: var(--bs-pagination-border-radius);

  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.page-item:last-child .page-link {
  border-top-left-radius: var(--bs-pagination-border-radius);
  border-bottom-left-radius: var(--bs-pagination-border-radius);

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

.active>.page-link, .page-link.active, .active>.page-link:hover, .page-link.active:hover {
  background-color: #6C07ED;
  border-color: #6C07ED;
  color: #ffffff;
}

.page-link,.page-link:hover{
  color: #6C07ED;
  padding: 10px 15px;
  padding-top: 15px;
}

.pagination {
  padding-right:0;
  padding-left:0;
}

.pagination .page-item .fa-angle-right,.pagination .page-item .fa-angle-double-right,
.pagination .page-item .fa-angle-left, .pagination .page-item .fa-angle-double-left {
  transform: rotateZ(180deg);
}

.cursor-pointer{
  cursor: pointer;
}

.carousel {
  margin: 50px auto;
  padding: 0 70px;
}

.carousel .item {   
  overflow: hidden;
}

.carousel-control-prev, .carousel-control-next {
  height: 44px;
  width: 30px;
  margin: auto 0;
  border-radius: 4px;
  opacity: 0.8;
}
.carousel-control-prev:hover, .carousel-control-next:hover { 
  opacity: 1;
}
.carousel-control-prev i, .carousel-control-next i {
  font-size: 36px;
  position: absolute;
  top: 50%;
  display: inline-block;
  margin: -19px 0 0 0;
  z-index: 5;
  left: 0;
  right: 0;
  color: #fff;
  text-shadow: none;
  font-weight: bold;
}
.carousel-control-prev i {
  margin-left: -2px;
}
.carousel-control-next i {
  margin-right: -4px;
}    

#buy .accordion .accordion-item,
#buy .accordion .accordion-item .accordion-button{
  background-color: #EFEFEF;
}


.rate {
  height: 46px;
  padding: 0 10px;
} 
.rate.readonly{
  padding: 0;
}
.rate:not(:checked) > input {
  position:absolute;
  top:-9999px;
}
.rate:not(:checked) > label {
  float:left;
  width:1em;
  overflow:hidden;
  white-space:nowrap;
  cursor:pointer;
  font-size:50px;
  color:#ccc;
}

.rate.readonly:not(:checked) > label{
  font-size:30px;
  cursor:default;
}

.rate:not(:checked) > label:before {
    content: '★ ';
}
.rate > input:checked ~ label {
    color: #ffc700;    
}
.rate:not(.readonly):not(:checked) > label:hover,
.rate:not(.readonly):not(:checked) > label:hover ~ label {
    color: #deb217;  
}
.rate:not(.readonly) > input:checked + label:hover,
.rate:not(.readonly) > input:checked + label:hover ~ label,
.rate:not(.readonly) > input:checked ~ label:hover,
.rate:not(.readonly) > input:checked ~ label:hover ~ label,
.rate:not(.readonly) > label:hover ~ input:checked ~ label {
    color: #c59b08;
}

 #packages .card{
  background-image: url("./images/package-card.png");
  background-repeat: no-repeat;
  background-position: top center; 
  background-size:  cover;
  transition: .2s;
}
#packages .card.active{
  cursor: default;
}
#packages .card:hover,
#packages .card.number:hover,
#packages .card.active{
  background-image: url("./images/package-card-hover.png");
  transition: .2s;
}

#packages .card.number{
  background-image: url("./images/package-card-number.png"); 
  transition: .2s;
} 
#packages .card.number *{
  color: #646464;
}
#packages .card:hover .card-title,#packages .card:hover .details *,
#packages .card.active .card-title,#packages .card.active .details *,
#packages .card.number:hover .card-subtitle *{
  color: #FFFFFF;
}
#packages .card:not(.number) .card-subtitle{
  background-color: #6C07ED;
  
}
#packages .card:not(.number) .card-subtitle *{ 
  color: #FFFFFF;
  transition: .2s;
}
#packages .card.number .card-subtitle{ 
  color: #FECC0F;
}
#packages .card:hover .card-subtitle,
#packages .card.active .card-subtitle{  
  background-color: transparent;
  transition: .2s;
}

#packages .card .card-footer{
  background-color: #E7E7FF;
  color: #646464; 
  border:2px solid #E7E7FF; 
}

#packages .card.number .card-footer{
  background-color: #FFFFFF;
  color: #FECC0F; 
  border:2px solid #FFFFFF;  
}

#packages .card.number .card-footer *{ 
  color: #FECC0F;  
}

#packages .card:hover .card-footer,
#packages .card.active .card-footer{
  border:2px solid #FECC0F; 
  background-color: #FFFFFF; 
  cursor: pointer;
}
#packages .card:hover .card-footer *,
#packages .card.active .card-footer *{
  color: #6C07ED; 
}

#packages .modal .modal-body{
  background-color: #F5F5FF;
}

#packages .modal .modal-body .form-floating input[type=text]{
  border: 0;
  background-color: #FFFFFF;
  border-radius: 8px;
  color: #000;
  font-size: 16px;
}

#packages .filter option{
  padding: 8px 16px;
}

#packages .card button {  
  border-color: #E7E7FF;
  color: #6C07ED;
}  
#packages .features{
  overflow-y: auto;
}

#packages .card button .chevron-up-packages{
  display: initial;
}

#packages .card:hover button .chevron-up-packages{
  display: none;
}

#packages .card button .chevron-up-packages-white{
  display: none;
}

#packages .card:hover button .chevron-up-packages-white{
  display: initial;
}

#packages .card:hover button{ 
  border-color: #BC8BFB;
  color: #FFFFFF;
}

#about-us{  
  margin-top: -35px
}
 
.safety { 
  left: 30px;
  bottom: -30px;

} 

.offcanvas-header{
  display: block;
  text-align: right;
}

/*
X-Small devices (portrait phones, less than 576px)
No media query for `xs` since this is the default in Bootstrap

Extra Small devices (phones, 576px and up)*/
@media (max-width: 576px) {   
  
  h2{
    font-size: 20px !important; 
  }

  .fs-1{
    font-size: 32px !important; 
  }

  .fs-2{
    font-size: 20px !important; 
  }

  .fs-3{
    font-size: 20px !important; 
  }

  .fs-4{
    font-size: 18px !important; 
  }

  .fs-5{
    font-size: 18px !important; 
  }

  .fs-6,a.btn,button.btn{
    font-size: 16px !important; 
  }

  .fs-7{ 
    font-size: 14px !important; 
  }

  .fs-8{ 
    font-size: 12px !important; 
  }
 
.spacer-200{
  display: block;
  height: 32px;
}

.spacer-128 ~ .spacer-128{
  display: block;
  height: 64px;
}

.spacer-64{
  display: block;
  height: 16px;
}

.spacer-32{
  display: block;
  height: 8px;
}


  #services .card-title{
    font-size: 16px;
  }

  #services .card img { 
    margin: 0px auto 10px;
  }
  
  .row-card{
    flex-direction: column;
  }

  .btn.btn-lg{
    width: 100%;
  }

  .row-card img.card-img-top{
    width: 100%;
  }

  .p-5 {
    padding: 1.5rem!important;
  }

  .carousel {
    margin: auto auto;
    padding: 20px 20px;
  }

  .carousel-control-prev, .carousel-control-next { 
    width: 10px;
  }

  .carousel .card-body {
    padding: 5px 0px 5px 5px;
  } 

  #numbers .card { 
    margin-bottom: 0px;
  } 

  #download-app {
    background-image:none;
    background-color: #6C07ED;
    border-radius: 32px;
    margin: auto 5px ;
  }

  #download-app .spacer-128{
    height:0px;
  }
  #download-app h3{
    font-weight: 400;
  }
  #download-app .card > img{
    margin:0px auto;
    width: 75%;
  }
  #services-numbers{
    margin: auto 5px ;
  }



  footer{
    border-top: 0;
  }

  footer h3{
    text-align: center;
    margin-top: 40px;
    font-weight: 700;  
    margin-left: 0;
  }

  footer ul li {
    text-align: center;
  }
  
  body{ 
    background-image: none;
  }

  #offcanvasNavbar{ 
    width: 93%;
  }

  #offcanvasNavbar,#offcanvasNavbar .dropdown-menu{
    background-color: #6C07ED;  
  }
 
  #offcanvasNavbar ul li a.nav-link{
    font-size: 20px !important;
    font-weight: 400;
  }
  #offcanvasNavbar ul li a.nav-link{
    color: #FFFFFF !important;  
  } 

  #offcanvasNavbar{
    left:0;
  }
  #offcanvasNavbar.offcanvas {
    height: 100vh;
  }
 
  #offcanvasNavbar .offcanvas-body{
    padding: 0;
  }

  #offcanvasNavbar .btn-close{
    background-image: url('./images/x-close.svg');
    --bs-btn-close-bg: auto; 
    --bs-btn-close-opacity: 1;
  } 

  .dropdown-toggle::after{
    content: url('./images/chevron-left-mobile.svg'); 
    transition: .2s;
    float: right;
    rotate: -180deg;
  }
  .dropdown-toggle.show::after{
    rotate: -90deg;
    transition: .2s;
    margin-top: 5px;
    margin-right: -5px; 
  } 
  
  #market-search img{
    top:4px;
  }
  
  .modal .modal-footer{
    flex-wrap: initial;
  }
  .navbar-toggler:focus {
    box-shadow:none;
  }

  #about-us{  
    margin-top: -54px
  }
} 

/* Medium devices (tablets, 768px and up) */
@media (max-width: 768px) {
  
}

/* Large devices (desktops, 992px and up) */
@media (max-width: 992px) {
  
}

/* X-Large devices (large desktops, 1200px and up) */
@media (max-width: 1200px) {
  
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (max-width: 1400px) {
  
}