/** Global **/

@tailwind utilities;

*{
  margin: 0px;
  box-sizing: border-box;
  list-style-type: none;
  padding: 0px;
  font-family: Tajawal, sans-serif;
}

body{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

a{
  text-decoration-color: transparent;
}

input[type="checkbox"]{
  min-height: 1.25rem;
  width: 1.25rem;
  min-width: 1.25rem;
  border-radius: 0.25rem;
  --tw-border-opacity: 1;
  border-color: rgb(90 64 155 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
  accent-color: #5A409B;
}

input[type="checkbox"]:focus{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(90 64 155 / var(--tw-ring-opacity));
}

#content{
  max-height: 100vh;
  overflow-x: hidden;
  overflow-y: scroll;
}

.customer #content{
  padding-top: 5rem;
}

@media (min-width: 1024px){
  .customer #content{
    padding-top: 7.56rem;
  }

  .customer #content:where([dir="ltr"], [dir="ltr"] *){
    margin-left: 7.1875rem;
  }

  .customer #content:where([dir="rtl"], [dir="rtl"] *){
    margin-right: 7.1875rem;
  }

  .customer #content.expanded:where([dir="ltr"], [dir="ltr"] *){
    margin-left: 15.25rem;
  }

  .customer #content.expanded:where([dir="rtl"], [dir="rtl"] *){
    margin-right: 15.25rem;
  }
}

.dropdown{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.tooltip.dropdown .dropdown-item > .tooltip-arrow:before{
  visibility: hidden;
}

[role="tooltip"].dropdown .dropdown-item > [data-popper-arrow]:before{
  visibility: hidden;
}

[role="tooltip"].dropdown .dropdown-item > [data-popper-arrow]:after{
  visibility: hidden;
}

.dropdown .dropdown-item{
  visibility: hidden;
  position: absolute;
  top: 100%;
  z-index: -10;
  display: none;
  --tw-translate-y: 0.75rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

@media (min-width: 1024px){
  .dropdown .dropdown-item{
    display: flex;
  }
}

.dropdown .dropdown-item.dropdown-active{
  visibility: visible;
  z-index: 20;
  --tw-translate-y: 0.6rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.logo{
  cursor: pointer;
}

.breadcrumb{
  margin-bottom: 1.69rem;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.breadcrumb-btn{
  display: flex;
  height: 3.5rem;
  width: 3.5rem;
  min-width: 3.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(203 195 223 / var(--tw-bg-opacity));
  padding-top: 1rem;
  padding-bottom: 1rem;
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.breadcrumb-btn:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
}

.breadcrumb-btn:hover svg path{
  fill: #ffffff;
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.breadcrumb-nav{
  display: flex;
  justify-content: space-between;
}

.breadcrumb-nav .breadcrumb-list{
  margin-bottom: 0.75rem;
  display: inline-flex;
  width: 60%;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
}

@media (min-width: 640px){
  .breadcrumb-nav .breadcrumb-list{
    margin-bottom: 0px;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: center;
  }
}

.breadcrumb-nav .breadcrumb-list .breadcrumb-item{
  display: flex;
  align-items: center;
}

.breadcrumb-nav .breadcrumb-list .breadcrumb-item .breadcrumb-list-btn{
  display: inline-flex;
  align-items: center;
  text-wrap: nowrap;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  text-align: center;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity));
}

.breadcrumb-nav .breadcrumb-list .breadcrumb-item .breadcrumb-list-btn:hover{
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
}

@media (min-width: 640px){
  .breadcrumb-nav .breadcrumb-list .breadcrumb-item .breadcrumb-list-btn{
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.breadcrumb-nav .breadcrumb-list .breadcrumb-item .breadcrumb-list-btn.active{
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
}

.checkBox-label-toggle{
  display: inline-flex;
  cursor: pointer;
  align-items: center;
}

.checkBox-toggle{
  position: relative;
  height: 1.5rem;
  width: 2.75rem;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}

.checkBox-toggle::after{
  position: absolute;
  top: 2px;
  inset-inline-start: 2px;
  height: 1.25rem;
  width: 1.25rem;
  border-radius: 9999px;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  --tw-content: '';
  content: var(--tw-content);
}

.checkBox-toggle.active{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.container{
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.content-section{
  margin-top: 2.56rem;
  width: 100%;
  border-radius: 0.9375rem;
  border-width: 1.5px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity));
  background-image: linear-gradient(113deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.80) 110.84%);
  padding-top: 1.75rem;
  padding-bottom: 1.75rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  --tw-shadow: 0px 2px 5.5px 0px rgba(0, 0, 0, 0.02);
  --tw-shadow-colored: 0px 2px 5.5px 0px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-backdrop-blur: blur(10.499999046325684px);
  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}

.modal{
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 50;
  display: none;
  height: 100vh;
  width: 100%;
  background-color: #22222260;
}

.modal:where([dir="rtl"], [dir="rtl"] *){
  left: auto;
  right: 0px;
}

.modal.show{
  display: block;
}

.modal-container{
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
}

@media (min-width: 1024px){
  .modal-container{
    padding-right: 16rem;
  }

  .modal-container:where([dir="ltr"], [dir="ltr"] *){
    padding-right: 0px;
    padding-left: 16rem;
  }
}

.modal-container .modal-content{
  position: relative;
  display: flex;
  height: 100%;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  overflow: auto;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-bottom: 4.12rem;
}

@media (min-width: 640px){
  .modal-container .modal-content{
    height: auto;
    max-height: 75%;
    width: 75%;
    border-radius: 1.25rem;
  }
}

@media (min-width: 1440px){
  .modal-container .modal-content{
    width: 59rem;
  }
}

@media (min-width: 640px){
  .EditOrderModal.modal-container .modal-content{
    max-height: 90% !important;
  }
}

.EditOrderModal.modal-container .modal-content .modal-body{
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

@media (min-width: 1440px){
  .EditOrderModal.modal-container .modal-content .modal-body{
    position: static;
  }
}

.EditOrderModal.modal-container .modal-content .modal-body form{
  max-width: 50%;
}

@media (min-width: 1440px){
  .EditOrderModal.modal-container .modal-content .modal-body form{
    max-width: 100%;
  }
}

.modal-container .modal-content .modal-title{
  padding-top: 5.06rem;
  padding-bottom: 2rem;
}

@media (min-width: 640px){
  .modal-container .modal-content .modal-title{
    padding-top: 4rem;
  }
}

@media (min-width: 1280px){
  .modal-container .modal-content .modal-title{
    padding-top: 5.06rem;
    padding-bottom: 3.62rem;
  }
}

.modal-container .modal-content .modal-title h1{
  text-align: center;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(52 64 84 / var(--tw-text-opacity));
}

.modal-container .modal-content .modal-body form{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1.25rem;
}

@media (min-width: 1440px){
  .modal-container .modal-content .modal-body form{
    height: 23.5625rem;
    width: 38.8125rem;
  }
}

.modal-container .modal-content .modal-body form .modal-lang{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1.25rem;
}

.modal-container .modal-content .modal-body form .modal-lang div{
  display: flex;
  height: auto;
  width: auto;
  cursor: pointer;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  border-radius: 0.25rem;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.modal-container .modal-content .modal-body form .modal-lang div:hover,
.modal-container .modal-content .modal-body form .modal-lang div.active{
  --tw-bg-opacity: 1;
  background-color: rgb(234 236 240 / var(--tw-bg-opacity));
}

.modal-container .modal-content .modal-body form .modal-lang li span{
  text-align: right;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(52 64 84 / var(--tw-text-opacity));
}

.modal-container .modal-content .modal-body form .modal-lang li span:where([dir="ltr"], [dir="ltr"] *){
  text-align: left;
}

.modal-container .modal-content .modal-body form .input-group,
.modal-container .modal-content .modal-body form .select-group{
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.625rem;
}

.modal-container .modal-content .modal-body form label{
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(52 64 84 / var(--tw-text-opacity));
}

.modal-container .modal-content .modal-body form .input-group input,
.modal-container .modal-content .modal-body form .select-group select{
  width: 100%;
  border-radius: 0.5rem;
  border-style: none;
  padding-top: 0.4375rem;
  padding-bottom: 0.4375rem;
  padding-left: 0.4375rem;
  padding-right: 0.4375rem;
  --tw-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.06), 0px 0px 0px 1px var(--Grey-200, #E5E5E5);
  --tw-shadow-colored: 0px 1px 3px 0px var(--tw-shadow-color), 0px 0px 0px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.tooltip.modal-container
    .modal-content
    .modal-body
    form
    .input-group
    input[type="file"] > .tooltip-arrow:before{
  visibility: hidden;
}

[role="tooltip"].modal-container
    .modal-content
    .modal-body
    form
    .input-group
    input[type="file"] > [data-popper-arrow]:before{
  visibility: hidden;
}

[role="tooltip"].modal-container
    .modal-content
    .modal-body
    form
    .input-group
    input[type="file"] > [data-popper-arrow]:after{
  visibility: hidden;
}

.modal-container
    .modal-content
    .modal-body
    form
    .input-group
    input[type="file"]{
  visibility: hidden;
  position: absolute;
  z-index: -10;
}

.modal-container .modal-content .modal-body form .input-group span{
  text-align: right;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  color: #22222299;
}

.modal-container .modal-content .modal-body form .input-group span:where([dir="ltr"], [dir="ltr"] *){
  text-align: left;
}

.modal-container .modal-content .modal-body form .input-group .input-file{
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  border-width: 2px;
  border-style: dashed;
  padding-top: 0.9375rem;
  padding-bottom: 0.9375rem;
}

.modal-container
    .modal-content
    .modal-body
    form
    .input-group
    .input-file
    button{
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.125rem;
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
}

.modal-container .modal-content .modal-body form button[type="submit"]{
  margin-top: 1rem;
  width: 18.3125rem;
  align-self: center;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  padding: 0.75rem;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

@media (min-width: 1024px){
  .modal-container .modal-content .modal-body form button[type="submit"]{
    margin-top: 0.5rem;
  }
}

@media (min-width: 1440px){
  .modal-container .modal-content .modal-body form button[type="submit"]{
    margin-top: 3rem;
  }
}

.modal-container .modal-content .modal-body form button[type="submit"]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.modal-container .modal-content .close{
  position: absolute;
  top: 2rem;
  left: 2rem;
  cursor: pointer;
}

@media (min-width: 640px){
  .modal-container .modal-content .close{
    left: 3rem;
  }
}

.modal-container .modal-content .close:where([dir="ltr"], [dir="ltr"] *){
  left: auto;
  right: 2rem;
}

@media (min-width: 640px){
  .modal-container .modal-content .close:where([dir="ltr"], [dir="ltr"] *){
    left: auto;
    right: 3rem;
  }
}

.tooltip-group{
  position: relative;
}

.tooltip-group .tooltip-item{
  position: absolute;
  left: 50%;
  top: 100%;
  z-index: 20;
  margin-bottom: 0.5rem;
  display: none;
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  cursor: pointer;
  text-wrap: nowrap;
  border-radius: 0.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.tooltip-group .tooltip-symbol{
  position: absolute;
  top: -0.5rem;
  display: flex;
  height: 1.5rem;
  width: 1.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(63 131 248 / var(--tw-bg-opacity));
}

.tooltip-group .tooltip-symbol:where([dir="ltr"], [dir="ltr"] *){
  right: -0.5rem;
}

.tooltip-group .tooltip-symbol:where([dir="rtl"], [dir="rtl"] *){
  left: -0.5rem;
}

.tooltip-group:hover .tooltip-item{
  display: block;
}

.tooltip-group .tooltip-item .tooltip-arrows{
  position: absolute;
  bottom: 100%;
  left: 50%;
  z-index: 20;
  height: 0.75rem;
  width: 0.75rem;
  --tw-translate-x: -50%;
  --tw-translate-y: 50%;
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
}

.web-search-item{
  width: 19.8125rem;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.input-with-icon{
  position: relative;
  display: flex;
  width: 100%;
  align-items: center;
}

.input-with-icon input{
  height: 100%;
  width: 100%;
  border-radius: 0.5rem;
  border-width: 0px;
  padding: 1.25rem;
}

.input-with-icon i{
  position: absolute;
}

.input-with-icon i:where([dir="ltr"], [dir="ltr"] *){
  right: 1.25rem;
}

.input-with-icon i:where([dir="rtl"], [dir="rtl"] *){
  left: 1.25rem;
}

.password-with-icon .icon svg.show path,
.password-with-icon .icon svg.show circle{
  stroke: #664ea0;
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.password-with-icon .icon svg.show path:hover,
.password-with-icon .icon svg.show circle:hover{
  stroke: #5A409B;
}

.password-with-icon .icon svg.hide path{
  fill: #664ea0;
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.password-with-icon .icon svg.hide path:hover{
  fill: #5A409B;
}

.indicator{
  position: absolute;
  top: -0.5rem;
  inset-inline-start: -0.5rem;
  display: inline-flex;
  height: 1.25rem;
  width: 1.25rem;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  font-size: 0.625rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.indicator:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.indicators{
  position: absolute;
  bottom: 1rem;
  inset-inline-end: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.indicators .indicators-item{
  display: flex;
  height: 1.88rem;
  width: 1.88rem;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.indicators .indicators-item:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
}

.indicators .indicators-item:hover svg{
  fill: #000000;
}

.logo img{
  height: 2.875rem;
  width: 8.49988rem;
  -o-object-fit: contain;
     object-fit: contain;
}

#scrollToTopButton{
  position: fixed;
  z-index: 50;
  display: none;
  height: 60px;
  width: 60px;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  padding: 7px;
  transition-duration: 150ms;
  transition-timing-function: linear;
}

#scrollToTopButton:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

#scrollToTopButton:where([dir="ltr"], [dir="ltr"] *){
  bottom: 17px;
  right: 17px;
}

#scrollToTopButton:where([dir="rtl"], [dir="rtl"] *){
  bottom: 80px;
  left: 17px;
}

.notyf__icon:where([dir="ltr"], [dir="ltr"] *){
  margin-right: 13px;
}

.notyf__icon:where([dir="rtl"], [dir="rtl"] *){
  margin-left: 13px;
}

#location_map_canvas{
  height: 400px;
  width: 100%;
}

.listTileEllipse{
  position: relative;
}

.listTileEllipse-item{
  display: none;
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.listTileEllipse-item:where([dir="ltr"], [dir="ltr"] *){
  padding-left: 0.5rem;
}

.listTileEllipse-item:where([dir="rtl"], [dir="rtl"] *){
  padding-right: 0.5rem;
}

.listTileEllipse-item.listTileEllipse-active{
  display: flex;
}

.tomSelectItem{
  position: relative;
  width: 100%;
}

.tomSelectItem .selectIcon{
  position: absolute;
  top: 0.5rem;
  z-index: 10;
}

.tomSelectItem .selectIcon:where([dir="ltr"], [dir="ltr"] *){
  right: 0.25rem;
}

.tomSelectItem .selectIcon:where([dir="rtl"], [dir="rtl"] *){
  left: 0.25rem;
}

.iti{
  width: 100%;
}

.iti__country-list:where([dir="ltr"], [dir="ltr"] *){
  right: 0px;
  text-align: left;
}

.iti__country-list:where([dir="rtl"], [dir="rtl"] *){
  left: 0px;
  text-align: right;
}

.iti__selected-flag{
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.iti__selected-flag:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.iti__selected-dial-code{
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.iti__arrow{
  margin-right: 6px;
  margin-left: 0px;
  --tw-border-opacity: 1;
  border-top-color: rgb(255 255 255 / var(--tw-border-opacity));
}

.iti__arrow--up{
  --tw-border-opacity: 1;
  border-bottom-color: rgb(255 255 255 / var(--tw-border-opacity));
}

input#phone,
input#phoneInput{
  padding-left: 52px;
}

/** Global End **/

/** Content **/

.content{
  width: 100%;
  padding-top: 6rem;
}

@media (min-width: 768px){
  .content{
    padding-bottom: 0px;
  }
}

#selection-buttons-container{
  position: fixed;
  top: 50%;
  z-index: 30;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#selection-buttons-container:where([dir="ltr"], [dir="ltr"] *){
  right: 0.5rem;
}

#selection-buttons-container:where([dir="rtl"], [dir="rtl"] *){
  left: 0.5rem;
}

#selection-buttons-container button{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 0.25rem;
  background-color: #c4bbdb90;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  transition-timing-function: linear;
}

#selection-buttons-container button:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(196 187 219 / var(--tw-bg-opacity));
}

#selection-buttons-container button span{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
}

/** Content End **/

/** Header **/

header{
  position: fixed;
  top: 0px;
  z-index: 50;
  display: flex;
  height: 6rem;
  width: 100%;
  align-items: center;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
}

@media (min-width: 1440px){
  header{
    padding-left: 2.25rem;
    padding-right: 2.25rem;
  }
}

header:where([dir="ltr"], [dir="ltr"] *){
  left: 0px;
}

header:where([dir="rtl"], [dir="rtl"] *){
  right: 0px;
}

header .container{
  display: flex;
    flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}
html[lang="sa"] header .container {
    flex-direction: row-reverse;
}
@media (min-width: 1440px){
  header .container{
    gap: 3.25rem;
  }
}

header .header-side{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
}

header .header-side .logoside{
  height: 2.875rem;
  min-width: 8.49988rem;
  overflow: hidden;
}

header .header-side .logoside a img{
  height: 2.875rem;
  min-width: 8.49988rem;
  -o-object-fit: contain;
     object-fit: contain;
}

header nav{
  position: fixed;
  top: 6rem;
  display: none;
  height: 100vh;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2rem;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

@media (min-width: 1024px){
  header nav{
    position: static;
    display: flex;
    height: auto;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0px;
    background-color: transparent;
  }
}

header nav:where([dir="ltr"], [dir="ltr"] *){
  left: -100%;
}
html[dir="rtl"] .landing-nav{
  direction: rtl !important;
}
html[dir="rtl"] #dropdown_list_sources div a{
  text-align: right !important;
}

header nav:where([dir="rtl"], [dir="rtl"] *){
  right: -100%;
}

header nav.expanded{
  display: flex;
}

header nav.expanded:where([dir="ltr"], [dir="ltr"] *){
  left: 0px;
}

header nav.expanded:where([dir="rtl"], [dir="rtl"] *){
  right: 0px;
}

header nav ul{
  margin-left: auto;
  margin-right: auto;
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (min-width: 640px){
  header nav ul{
    max-width: 640px;
  }
}

@media (min-width: 768px){
  header nav ul{
    max-width: 768px;
  }
}

@media (min-width: 1024px){
  header nav ul{
    margin-left: 0px;
    margin-right: 0px;
    flex-direction: row;
    align-items: center;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1280px){
  header nav ul{
    gap: 0.625rem;
  }
}

header nav ul.lang-list{
  width: 100%;
}

@media (min-width: 1024px){
  header nav ul.lang-list{
    width: auto;
  }
}

header nav ul li:not(.dropdown){
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 1280px){
  header nav ul li:not(.dropdown){
    width: 6.4375rem;
  }
}

header nav ul li:not(.dropdown-item) > a{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}

header nav ul li > a,
header nav ul li > a span.langtext{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

/* header nav ul li > a span.langtext {
  @apply hidden xl:block;
} */

header nav ul li > a.active,
header nav ul li > a:hover,
header nav ul li > a:hover span.langtext{
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
}

header nav ul li > a svg{
  min-width: 1.5rem;
}

header nav ul li > a.active svg path,
header nav ul li > a:hover svg path{
  stroke: #5A409B;
}

header .dropdown{
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

@media (min-width: 1024px){
  header .dropdown{
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
}

header .dropdown .dropdown-item{
  position: static;
  padding-left: 1rem;
  padding-right: 1rem;
}

@media (min-width: 1024px){
  header .dropdown .dropdown-item{
    position: absolute;
    border-radius: 0.375rem;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    padding: 1rem;
    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}

header .dropdown .dropdown-item:where([dir="ltr"], [dir="ltr"] *){
  left: 0px;
}

header .dropdown .dropdown-item:where([dir="rtl"], [dir="rtl"] *){
  right: 0px;
}

header .dropdown .dropdown-item.dropdown-active{
  display: flex;
}

#dropdown_list_sources{
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.3125rem;
}

@media (min-width: 1024px){
  #dropdown_list_sources{
    display: flex;
    width: 11.875rem;
  }
}

#dropdown_list_sources div{
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: flex-start;
  gap: 0.4375rem;
  border-radius: 0.25rem;
  padding: 0.3125rem;
}

#dropdown_list_sources div.active,
#dropdown_list_sources div:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
}

#dropdown_list_sources div i{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  padding: 0.25rem;
}

#dropdown_list_sources div a{
  width: 100%;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

#dropdown_list_sources div.active a,
#dropdown_list_sources div:hover a{
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
}

@media (min-width: 1024px){
  #dropdown_list_lang{
    width: 10.5625rem;
  }
}

#dropdown_list_lang > a{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25rem;
}

#dropdown_list_lang > a > span{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

header .auth{
  display: none;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

html[dir="rtl"] header .auth{
    flex-direction: row-reverse !important;
}
@media (min-width: 640px){
  header .auth{
    display: flex;
  }
}

header .auth-mobile{
  margin-left: auto;
  margin-right: auto;
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (min-width: 640px){
  header .auth-mobile{
    display: none;
    max-width: 640px;
  }
}

@media (min-width: 768px){
  header .auth-mobile{
    max-width: 768px;
  }
}

@media (min-width: 1024px){
  header .auth-mobile{
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}

header .auth > a,
header .auth-mobile > a{
  display: flex;
  width: 9.375rem;
  align-items: center;
  justify-content: center;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

@media (min-width: 1024px){
  header .auth > a,
header .auth-mobile > a{
    height: 3.125rem;
    padding-top: 0px;
    padding-bottom: 0px;
  }
}

header .auth > a,
header .auth-mobile > a{
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(243 241 246 / var(--tw-bg-opacity));
  font-size: 1.125rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

header .auth > a:hover,
header .auth-mobile > a:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}

header .auth > a:first-child,
header .auth-mobile > a:first-child{
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

header .auth > a:first-child:hover,
header .auth-mobile > a:first-child:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

@media (min-width: 1024px){
  .burger{
    display: none;
  }
}

.burger:where([dir="ltr"], [dir="ltr"] *){
  --tw-scale-x: -1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

/** Header End **/

/** Footer **/

.footer{
  position: relative;
  bottom: 0px;
  left: 0px;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}

.footer h1.title{
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(237 233 254 / var(--tw-text-opacity));
}

@media (min-width: 1024px){
  .footer h1.title{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.footer-top{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

@media (min-width: 768px){
  .footer-top{
    gap: 2.5rem;
  }
}

@media (min-width: 1024px){
  .footer-top{
    gap: 4rem;
  }
}

@media (min-width: 1280px){
  .footer-top{
    flex-wrap: nowrap;
    gap: 8.44rem;
  }
}

.footer-top-info{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1.56rem;
}

@media (min-width: 768px){
  .footer-top-info .descripton{
    margin-right: 1.94rem;
  }
}

.footer-top-info .descripton p{
  text-align: justify;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(229 231 235 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.footer-top-info .descripton p:hover{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.footer-top-info .mobile-app-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
}

.footer-top-nav{
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1rem;
}

@media (min-width: 768px){
  .footer-top-nav{
    gap: 1.5rem;
  }
}

@media (min-width: 1024px){
  .footer-top-nav{
    justify-content: space-between;
    gap: 3.75rem;
  }
}

@media (min-width: 1280px){
  .footer-top-nav{
    flex-wrap: nowrap;
  }
}

.footer .footer-nav,
.footer .quick-links,
.footer .contact-info{
  display: flex;
  min-width: 11rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1rem;
}

@media (min-width: 768px){
  .footer .footer-nav,
.footer .quick-links,
.footer .contact-info{
    gap: 1.5rem;
  }
}

.footer .footer-nav ul,
.footer .quick-links ul{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.75rem;
}

@media (min-width: 768px){
  .footer .footer-nav ul,
.footer .quick-links ul{
    width: 11rem;
  }
}

@media (min-width: 1280px){
  .footer .footer-nav ul,
.footer .quick-links ul{
    width: auto;
  }
}

.footer .contact-info ul:not(.social-list){
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1.5rem;
}

@media (min-width: 768px){
  .footer .contact-info ul:not(.social-list){
    width: 11rem;
  }
}

@media (min-width: 1280px){
  .footer .contact-info ul:not(.social-list){
    width: auto;
  }
}

.footer .footer-nav ul li a,
.footer .quick-links ul li a,
.footer .contact-info ul li a{
  width: 100%;
  text-wrap: nowrap;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(229 231 235 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.footer .footer-nav ul li a:hover,
.footer .quick-links ul li a:hover,
.footer .contact-info ul li a:hover{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.footer .contact-info ul li:not(.social){
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
}

.footer .contact-info ul li.social{
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
}

.footer .contact-info ul li.social > ul.social-list{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.footer .contact-info ul li.social > ul.social-list li a{
  display: flex;
  height: 1.5rem;
  width: 1.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(42 42 42 / var(--tw-bg-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.footer .contact-info ul li.social > ul.social-list li a:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

@media (min-width: 1280px){
  .footer .contact-info ul li.social > ul.social-list li a{
    height: 2.5rem;
    width: 2.5rem;
  }
}

.footer .contact-info ul li.social > ul.social-list li a svg{
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 1280px){
  .footer .contact-info ul li.social > ul.social-list li a svg{
    height: 1.5rem;
    width: 1.5rem;
  }
}

.footer-bottom{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  border-top-width: 0.0625rem;
  border-top-color: #43434380;
  padding-top: 0.81rem;
  padding-bottom: 0.81rem;
}

@media (min-width: 768px){
  .footer-bottom{
    flex-direction: row;
  }
}

.tax-number{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
}

.tax-number p{
  text-wrap: nowrap;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.copyright p{
  text-wrap: nowrap;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

/** Footer End **/

/** Landing **/

.hero{
  width: 100%;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  padding-top: 4.25rem;
  padding-bottom: 2rem;
}

.hero .container{
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
}

.hero .container .hero-data{
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3.5rem;
}

.hero .container .hero-data .hero-text{
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.06rem;
}

@media (min-width: 1024px){
  .hero .container .hero-data .hero-text{
    max-width: 58.0625rem;
  }
}

.hero .container .hero-data .hero-text h1{
  text-align: center;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 768px){
  .hero .container .hero-data .hero-text h1{
    font-size: 2.375rem;
  }
}

.hero .container .hero-data .hero-text p{
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(72 71 74 / var(--tw-text-opacity));
}

@media (min-width: 768px){
  .hero .container .hero-data .hero-text p{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.hero .container .hero-data .hero-btn{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}

.hero .container .hero-data .hero-btn button{
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  padding-left: 2.75rem;
  padding-right: 2.75rem;
  font-size: 1.125rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.hero .container .hero-data .hero-btn button:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.hero .container .hero-data .hero-btn p{
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(72 71 74 / var(--tw-text-opacity));
}

.hero .container .hero-img{
  width: 100%;
  max-width: 69.0625rem;
  overflow: hidden;
}

.hero .container .hero-img img{
  width: 100%;
  max-width: 69.0625rem;
  -o-object-fit: contain;
     object-fit: contain;
}

.masfufatInNumbers{
  margin-top: 2.5rem;
}

@media (min-width: 1024px){
  .masfufatInNumbers{
    margin-top: 5.5rem;
  }
}

.masfufatInNumbers .top-title{
  margin-bottom: 3.06rem;
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.19rem;
}

.masfufatInNumbers .top-title h1,
.howMasfufatWork .top-title h1{
  text-align: center;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 768px){
  .masfufatInNumbers .top-title h1,
.howMasfufatWork .top-title h1{
    font-size: 2.375rem;
  }
}

.masfufatInNumbers .top-title p,
.howMasfufatWork .top-title p{
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(78 78 78 / var(--tw-text-opacity));
}

@media (min-width: 768px){
  .masfufatInNumbers .top-title p,
.howMasfufatWork .top-title p{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.masfufatInNumbers-content{
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2rem;
  border-radius: 1.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  padding: 2rem;
}

@media (min-width: 640px){
  .masfufatInNumbers-content{
    align-items: center;
    justify-content: center;
  }
}

@media (min-width: 768px){
  .masfufatInNumbers-content{
    height: 9.6875rem;
    flex-wrap: nowrap;
    padding: 0px;
  }
}

@media (min-width: 1024px){
  .masfufatInNumbers-content{
    gap: 5.625rem;
  }
}

.masfufatInNumbers-item{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.9375rem;
}

.masfufatInNumbers-item > .img{
  display: flex;
  height: 4.1875rem;
  min-width: 4.1875rem;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.masfufatInNumbers-item > .img:not(.electronicshopimg) > img{
  height: 4.1875rem;
  width: 4.1875rem;
  -o-object-fit: contain;
     object-fit: contain;
}

.masfufatInNumbers-item > ul > li:first-child{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .masfufatInNumbers-item > ul > li:first-child{
    font-size: 2.25rem;
  }
}

.masfufatInNumbers-item > ul > li:last-child{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(72 71 74 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .masfufatInNumbers-item > ul > li:last-child{
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

.howMasfufatWork{
  margin-top: 2.5rem;
}

@media (min-width: 1024px){
  .howMasfufatWork{
    margin-top: 6.6875rem;
  }
}

.howMasfufatWork .top-title{
  margin-bottom: 3.06rem;
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.19rem;
}

.howMasfufatWork-content{
  display: grid;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

@media (min-width: 640px){
  .howMasfufatWork-content{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px){
  .howMasfufatWork-content{
    display: flex;
  }
}

.howMasfufatWork-content .arrow{
  display: none;
  --tw-scale-x: 3;
  --tw-scale-y: 3;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  padding-top: 0.625rem;
}

@media (min-width: 1024px){
  .howMasfufatWork-content .arrow{
    display: block;
  }
}

.howMasfufatWork-content .stage{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

@media (min-width: 1024px){
  .howMasfufatWork-content .stage{
    gap: 2.79rem;
  }
}

.howMasfufatWork-content .stage .number{
  display: flex;
  height: 4.6875rem;
  width: 4.41713rem;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(224deg, #7553b9 50%, #5a409b 50%);
}

.howMasfufatWork-content .stage .number:where([dir="ltr"], [dir="ltr"] *){
  border-radius: 1.5625rem 1.5625rem 0 1.5625rem;
}

.howMasfufatWork-content .stage .number:where([dir="rtl"], [dir="rtl"] *){
  border-radius: 1.5625rem 1.5625rem 1.5625rem 0rem;
}

.howMasfufatWork-content .stage .number p{
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
  font-size: 3.5rem;
  font-weight: 500;
  line-height: 1;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.howMasfufatWork-content .stage > .content{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding-top: 0px;
}

@media (min-width: 1024px){
  .howMasfufatWork-content .stage > .content{
    gap: 1.46rem;
  }
}

.howMasfufatWork-content .stage .content h2{
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.howMasfufatWork-content .stage .content p{
  width: 75%;
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(78 78 78 / var(--tw-text-opacity));
}

@media (min-width: 640px){
  .howMasfufatWork-content .stage .content p{
    width: 100%;
  }
}

.landing-section .container{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}
.landing-section .info {
    text-align: right;
}

html[lang="en"] .landing-section .info {
    text-align: left;
}
@media (min-width: 1024px){
  .landing-section .container{
    flex-direction: row;
    gap: 2rem;
  }
}

@media (min-width: 1280px){
  .landing-section .container{
    gap: 6rem;
    padding-left: 1.625rem;
    padding-right: 1.625rem;
  }
}

.landing-section .container .info{
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1rem;
}

@media (min-width: 1024px){
  .landing-section .container .info{
    width: 50%;
  }
}

@media (min-width: 1280px){
  .landing-section .container .info{
    width: 100%;
    max-width: 40.3125rem;
  }
}

.landing-section .container .info h1{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .landing-section .container .info h1{
    font-size: 2.375rem;
  }
}

.landing-section .container .info p{
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(72 71 74 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .landing-section .container .info p{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

@media (min-width: 640px){
  .landing-section .container .info ul{
    list-style-type: disc;
  }
}

.landing-section .container .info ul li span:first-child{
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(72 71 74 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .landing-section .container .info ul li span:first-child{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.landing-section .container .info ul li span:last-child{
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(72 71 74 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .landing-section .container .info ul li span:last-child{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.landing-section:not(.mobileApps) .container .img{
  height: 23.25rem;
  min-width: 50%;
  overflow: hidden;
}

@media (min-width: 1280px){
  .landing-section:not(.mobileApps) .container .img{
    min-width: 32.3125rem;
  }
}

.landing-section:not(.mobileApps) .container .img img{
  height: 23.25rem;
  min-width: 50%;
  -o-object-fit: contain;
     object-fit: contain;
}

@media (min-width: 1280px){
  .landing-section:not(.mobileApps) .container .img img{
    min-width: 32.3125rem;
  }
}

.getEasyProfits{
  margin-top: 2rem;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

@media (min-width: 1024px){
  .getEasyProfits{
    margin-top: 5.06rem;
    padding-top: 9.81rem;
    padding-bottom: 11.31rem;
  }
}

.synchronization{
  margin-top: 2rem;
  margin-bottom: 2rem;
}

@media (min-width: 1024px){
  .synchronization{
    margin-top: 9.5rem;
    margin-bottom: 9.5rem;
  }
}

.providingProducts{
  margin-bottom: 2rem;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

@media (min-width: 1024px){
  .providingProducts{
    margin-bottom: 8.18rem;
    padding-top: 9.81rem;
    padding-bottom: 10.44rem;
  }
}

.mobileApps{
  margin-top: 2rem;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

@media (min-width: 1024px){
  .mobileApps{
    margin-top: 11.98rem;
    padding-top: 5.25rem;
    padding-bottom: 5.25rem;
  }
}

.mobileApps .container .img{
  height: 36.0625rem;
  min-width: 30.3125rem;
  overflow: hidden;
}

.mobileApps .container .img img{
  height: 36.0625rem;
  min-width: 30.3125rem;
  -o-object-fit: contain;
     object-fit: contain;
}

.download-phrase{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity));
}

.mobile-app-container{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
}

.getEasyProfits .container,
.providingProducts .container,
.mobileApps .container{
  flex-direction: column-reverse;
}

@media (min-width: 1024px){
  .getEasyProfits .container,
.providingProducts .container,
.mobileApps .container{
    flex-direction: row;
  }
}

.whyWait{
  padding-top: 2rem;
  padding-bottom: 2rem;
}

@media (min-width: 1024px){
  .whyWait{
    padding-top: 4.69rem;
    padding-bottom: 4.69rem;
  }
}

.whyWait .container{
  display: flex;
  align-items: center;
  justify-content: center;
}

.whyWait .container .box{
  display: flex;
  width: 100%;
  max-width: 70rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.75rem;
  border-radius: 1.5rem;
  background-image: linear-gradient(99deg, #5A409B 53.12%, #DED9EB 133.43%);
  padding: 1rem;
}

@media (min-width: 1024px){
  .whyWait .container .box{
    height: 18.5rem;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

.whyWait .container .box .img{
  min-width: 50%;
  overflow: hidden;
}

@media (min-width: 1280px){
  .whyWait .container .box .img{
    min-width: 23.6875rem;
  }
}

.whyWait .container .box .img img{
  min-width: 50%;
  -o-object-fit: contain;
     object-fit: contain;
}

@media (min-width: 1280px){
  .whyWait .container .box .img img{
    min-width: 23.6875rem;
  }
}

.whyWait .container .box .text{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.875rem;
}

@media (min-width: 1024px){
  .whyWait .container .box .text{
    height: 16rem;
  }
}

.whyWait .container .box .text .title{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}

.whyWait .container .box .text .title h2{
  width: 90%;
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

@media (min-width: 640px){
  .whyWait .container .box .text .title h2{
    width: auto;
  }
}

@media (min-width: 1280px){
  .whyWait .container .box .text .title h2{
    font-size: 1.75rem;
  }
}

.whyWait .container .box .text .btn button{
  margin-bottom: 1.5rem;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  padding-left: 2.75rem;
  padding-right: 2.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.whyWait .container .box .text .btn button:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(203 195 223 / var(--tw-bg-opacity));
}

@media (min-width: 1280px){
  .whyWait .container .box .text .btn button{
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

.whyWait .container .box .text .btn p{
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

@media (min-width: 1024px){
  .whyWait .container .box .text .btn p{
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

.successPartners{
  padding-top: 2.5rem;
}

@media (min-width: 1024px){
  .successPartners{
    padding-top: 3.94rem;
  }
}

.successPartners .container{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3.12rem;
}

.successPartners .title h1{
  font-size: 2.375rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.successPartners-content{
  margin-bottom: 5rem;
  width: 100%;
  max-width: 71.625rem;
}

.swiper{
  height: 5rem;
  width: 100%;
}

.swiper-slide{
  display: flex;
  min-width: 50px;
  align-items: center;
  justify-content: center;
}

.swiper-slide img{
  height: 4.375rem;
  width: 4.375rem;
  min-width: 70px;
  -o-object-fit: contain;
     object-fit: contain;
}

.swiper-button-next,
.swiper-button-prev{
  top: 1.5rem;
  z-index: 30;
  display: flex;
  height: 5rem;
  min-width: 4.375rem;
  align-items: center;
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.swiper-button-next svg,
.swiper-button-prev svg{
  position: relative;
  z-index: 30;
}

.swiper-button-next, .swiper-rtl .swiper-button-prev{
  right: 0px;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next{
  left: 0px;
}

.visible{
  visibility: visible !important;
}

.invisible{
  visibility: hidden !important;
}

.collapse{
  visibility: collapse !important;
}

.static{
  position: static !important;
}

.fixed{
  position: fixed !important;
}

.absolute{
  position: absolute !important;
}

.relative{
  position: relative !important;
}

.inset-0{
  inset: 0px !important;
}

.bottom-0{
  bottom: 0px !important;
}

.bottom-\[60px\]{
  bottom: 60px !important;
}

.left-0{
  left: 0px !important;
}

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

.top-0{
  top: 0px !important;
}

.z-10{
  z-index: 10 !important;
}

.z-20{
  z-index: 20 !important;
}

.z-30{
  z-index: 30 !important;
}

.z-40{
  z-index: 40 !important;
}

.z-50{
  z-index: 50 !important;
}

.mb-1{
  margin-bottom: 0.25rem !important;
}

.mb-2{
  margin-bottom: 0.5rem !important;
}

.mt-2{
  margin-top: 0.5rem !important;
}

.block{
  display: block !important;
}

.inline-block{
  display: inline-block !important;
}

.inline{
  display: inline !important;
}

.flex{
  display: flex !important;
}

.table{
  display: table !important;
}

.grid{
  display: grid !important;
}

.hidden{
  display: none !important;
}

.h-4{
  height: 1rem !important;
}

.h-6{
  height: 1.5rem !important;
}

.h-9{
  height: 2.25rem !important;
}

.w-1\/2{
  width: 50% !important;
}

.w-4{
  width: 1rem !important;
}

.w-64{
  width: 16rem !important;
}

.flex-1{
  flex: 1 1 0% !important;
}

.flex-shrink{
  flex-shrink: 1 !important;
}

.-translate-x-full{
  --tw-translate-x: -100% !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.-translate-y-full{
  --tw-translate-y: -100% !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.translate-x-0{
  --tw-translate-x: 0px !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.translate-x-full{
  --tw-translate-x: 100% !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.translate-y-full{
  --tw-translate-y: 100% !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.rotate-180{
  --tw-rotate: 180deg !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.transform{
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.transform-none{
  transform: none !important;
}

.cursor-default{
  cursor: default !important;
}

.cursor-not-allowed{
  cursor: not-allowed !important;
}

.cursor-pointer{
  cursor: pointer !important;
}

.resize{
  resize: both !important;
}

.grid-cols-4{
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.grid-cols-7{
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}

.items-start{
  align-items: flex-start !important;
}

.items-end{
  align-items: flex-end !important;
}

.items-center{
  align-items: center !important;
}

.justify-start{
  justify-content: flex-start !important;
}

.justify-end{
  justify-content: flex-end !important;
}

.justify-center{
  justify-content: center !important;
}

.justify-between{
  justify-content: space-between !important;
}

.space-x-2 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0 !important;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse)) !important;
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))) !important;
}

.overflow-hidden{
  overflow: hidden !important;
}

.rounded-lg{
  border-radius: 0.5rem !important;
}

.rounded-e-lg{
  border-start-end-radius: 0.5rem !important;
  border-end-end-radius: 0.5rem !important;
}

.rounded-l-lg{
  border-top-left-radius: 0.5rem !important;
  border-bottom-left-radius: 0.5rem !important;
}

.rounded-r-lg{
  border-top-right-radius: 0.5rem !important;
  border-bottom-right-radius: 0.5rem !important;
}

.rounded-s-lg{
  border-start-start-radius: 0.5rem !important;
  border-end-start-radius: 0.5rem !important;
}

.border{
  border-width: 1px !important;
}

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

.border-blue-600{
  --tw-border-opacity: 1 !important;
  border-color: rgb(28 100 242 / var(--tw-border-opacity)) !important;
}

.border-blue-700{
  --tw-border-opacity: 1 !important;
  border-color: rgb(26 86 219 / var(--tw-border-opacity)) !important;
}

.border-gray-100{
  --tw-border-opacity: 1 !important;
  border-color: rgb(243 244 246 / var(--tw-border-opacity)) !important;
}

.border-gray-300{
  --tw-border-opacity: 1 !important;
  border-color: rgb(209 213 219 / var(--tw-border-opacity)) !important;
}

.\!bg-gray-50{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity)) !important;
}

.bg-blue-700{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(26 86 219 / var(--tw-bg-opacity)) !important;
}

.bg-gray-100{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity)) !important;
}

.bg-gray-200{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity)) !important;
}

.bg-gray-800{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity)) !important;
}

.bg-gray-900\/50{
  background-color: rgb(17 24 39 / 0.5) !important;
}

.bg-white{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
}

.bg-white\/50{
  background-color: rgb(255 255 255 / 0.5) !important;
}

.p-1{
  padding: 0.25rem !important;
}

.p-2\.5{
  padding: 0.625rem !important;
}

.p-4{
  padding: 1rem !important;
}

.px-2{
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

.px-5{
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}

.py-2{
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.py-2\.5{
  padding-top: 0.625rem !important;
  padding-bottom: 0.625rem !important;
}

.py-3{
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}

.pt-2{
  padding-top: 0.5rem !important;
}

.text-center{
  text-align: center !important;
}

.text-lg{
  font-size: 1.125rem !important;
  line-height: 1.75rem !important;
}

.text-sm{
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}

.font-medium{
  font-weight: 500 !important;
}

.font-semibold{
  font-weight: 600 !important;
}

.uppercase{
  text-transform: uppercase !important;
}

.leading-6{
  line-height: 1.5rem !important;
}

.leading-9{
  line-height: 2.25rem !important;
}

.text-blue-600{
  --tw-text-opacity: 1 !important;
  color: rgb(28 100 242 / var(--tw-text-opacity)) !important;
}

.text-gray-400{
  --tw-text-opacity: 1 !important;
  color: rgb(156 163 175 / var(--tw-text-opacity)) !important;
}

.text-gray-500{
  --tw-text-opacity: 1 !important;
  color: rgb(107 114 128 / var(--tw-text-opacity)) !important;
}

.text-gray-800{
  --tw-text-opacity: 1 !important;
  color: rgb(31 41 55 / var(--tw-text-opacity)) !important;
}

.text-gray-900{
  --tw-text-opacity: 1 !important;
  color: rgb(17 24 39 / var(--tw-text-opacity)) !important;
}

.text-white{
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
}

.opacity-0{
  opacity: 0 !important;
}

.opacity-100{
  opacity: 1 !important;
}

.shadow{
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1) !important;
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

.shadow-lg{
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important;
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

.outline{
  outline-style: solid !important;
}

.blur{
  --tw-blur: blur(8px) !important;
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
}

.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
}

.transition{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter !important;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter !important;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 150ms !important;
}

.transition-opacity{
  transition-property: opacity !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 150ms !important;
}

.transition-transform{
  transition-property: transform !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 150ms !important;
}

.ease-out{
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1) !important;
}

::-webkit-scrollbar {
  width: 0.1rem !important;
}

::-webkit-scrollbar-track {
  background: #f7f5fa !important;
}

::-webkit-scrollbar-thumb {
  background-color: #5a409b !important;
  /* Scrollbar color */
  border-radius: 0.3125rem !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #f7f5fa !important;
  /* Scrollbar color on hover */
}

html,
    * {
  scrollbar-width: thin !important;
  /* Makes scrollbar thinner */
  scrollbar-color: #5a409b #f7f5fa !important;
  /* Thumb and track color */
}

html[dir="ltr"] header .container .logo-side .burger i svg {
  transform: scaleX(-1) !important;
}

html[dir="rtl"] #content,
    html[dir="rtl"] #aside {
  direction: ltr !important;
}

html[dir="ltr"] #content,
    html[dir="ltr"] #aside {
  direction: rtl !important;
}

html[dir="rtl"] #content .container,
    html[dir="rtl"] #aside .container,
    html[dir="rtl"] #aside ul.aside-list {
  direction: rtl !important;
}

html[dir="ltr"] #content .container html[dir="ltr"] #aside .container {
  direction: ltr !important;
}

html[dir="ltr"] .modal {
  direction: ltr !important;
}

html[dir="rtl"] .modal {
  direction: rtl !important;
}

@media (max-width: 1024px) {
}

/** Landing End **/

/** About us **/

.welcomeAbout{
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

@media (min-width: 1024px){
  .welcomeAbout{
    margin-top: 7.44rem;
    margin-bottom: 8.94rem;
  }

  .welcomeAbout .container,
.mission .container{
    gap: 4.375rem;
  }
}

.mission .container{
  flex-direction: column-reverse;
}

@media (min-width: 1024px){
  .mission .container{
    flex-direction: row;
  }
}

.welcomeAbout.landing-section:not(.mobileApps) .container .img,
.mission.landing-section:not(.mobileApps) .container .img{
  min-width: 50%;
  overflow: hidden;
}

@media (min-width: 1024px){
  .welcomeAbout.landing-section:not(.mobileApps) .container .img,
.mission.landing-section:not(.mobileApps) .container .img{
    height: 31.75rem;
  }
}

@media (min-width: 1280px){
  .welcomeAbout.landing-section:not(.mobileApps) .container .img,
.mission.landing-section:not(.mobileApps) .container .img{
    min-width: 27.625rem;
  }
}

.welcomeAbout.landing-section:not(.mobileApps) .container .img img,
.mission.landing-section:not(.mobileApps) .container .img img{
  min-width: 50%;
  -o-object-fit: contain;
     object-fit: contain;
}

@media (min-width: 1024px){
  .welcomeAbout.landing-section:not(.mobileApps) .container .img img,
.mission.landing-section:not(.mobileApps) .container .img img{
    height: 31.75rem;
  }
}

@media (min-width: 1280px){
  .welcomeAbout.landing-section:not(.mobileApps) .container .img img,
.mission.landing-section:not(.mobileApps) .container .img img{
    min-width: 27.625rem;
  }
}

.welcomeAbout .container .info,
.mission .container .info{
  gap: 1rem;
}

@media (min-width: 1024px){
  .welcomeAbout .container .info,
.mission .container .info{
    gap: 2rem;
  }
}

@media (min-width: 1280px){
  .welcomeAbout .container .info,
.mission .container .info{
    max-width: 37.375rem;
  }
}

.landing-section .container .info .title{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.375rem;
}

.landing-section .container .info .title span{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(149 149 149 / var(--tw-text-opacity));
}

@media (min-width: 1024px){
  .landing-section .container .info .title span{
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

.landing-section .container .info .title h1{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .landing-section .container .info .title h1{
    font-size: 2.25rem;
  }
}

.welcomeAbout.landing-section .container .info p,
.mission.landing-section .container .info p{
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.welcomeAbout.landing-section .container .info ul,
.mission.landing-section .container .info ul{
  display: flex;
  list-style-type: none;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2rem;
}

@media (min-width: 1024px){
  .welcomeAbout.landing-section .container .info ul,
.mission.landing-section .container .info ul{
    gap: 3.125rem;
  }
}

.welcomeAbout.landing-section .container .info ul li,
.mission.landing-section .container .info ul li{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.375rem;
}

.welcomeAbout.landing-section .container .info ul li strong,
.mission.landing-section .container .info ul li strong{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(90 64 155 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .welcomeAbout.landing-section .container .info ul li strong,
.mission.landing-section .container .info ul li strong{
    font-size: 2rem;
  }
}

.welcomeAbout.landing-section .container .info ul li span,
.mission.landing-section .container .info ul li span{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(122 122 122 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .welcomeAbout.landing-section .container .info ul li span,
.mission.landing-section .container .info ul li span{
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

.vision{
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

@media (min-width: 1024px){
  .vision{
    margin-top: 6.88rem;
    margin-bottom: 11.09rem;
  }
}

.vision .container{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
}

@media (min-width: 1024px){
  .vision .container{
    gap: 4.75rem;
  }
}

.vision .container .top-title h1{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .vision .container .top-title h1{
    font-size: 2.375rem;
  }
}

.vision .container .vision-content .vision-container{
  display: grid;
  width: 100%;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 3.875rem;
}

@media (min-width: 640px){
  .vision .container .vision-content .vision-container{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px){
  .vision .container .vision-content .vision-container{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.vision .container .vision-content .vision-container .vision-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

@media (min-width: 1024px){
  .vision .container .vision-content .vision-container .vision-item{
    gap: 2.1rem;
  }
}

.vision .container .vision-content .vision-container .vision-item .text{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

@media (min-width: 1024px){
  .vision .container .vision-content .vision-container .vision-item .text{
    gap: 1.5rem;
  }
}

.vision .container .vision-content .vision-container .vision-item .text h1{
  text-align: center;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity));
}

.vision .container .vision-content .vision-container .vision-item .text p{
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .vision .container .vision-content .vision-container .vision-item:nth-child(1),
.vision .container .vision-content .vision-container .vision-item:nth-child(2),
.vision .container .vision-content .vision-container .vision-item:nth-child(3){
    margin-bottom: 2.65rem;
  }
}

.whyWaitAbout .container{
  display: flex;
  align-items: center;
  justify-content: center;
}

.whyWaitAbout .container .box{
  margin-bottom: 2.5rem;
  display: flex;
  width: 100%;
  max-width: 77.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 2.5rem;
  background-image: linear-gradient(180deg, #DED9EB 0%, #DED9EB 100%);
  padding: 1rem;
}

@media (min-width: 1024px){
  .whyWaitAbout .container .box{
    margin-bottom: 5.69rem;
  }
}

@media (min-width: 1280px){
  .whyWaitAbout .container .box{
    height: 21.75rem;
    padding: 0px;
  }
}

.whyWaitAbout .container .box .text{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}

@media (min-width: 1024px){
  .whyWaitAbout .container .box .text{
    gap: 2.5rem;
  }
}

.whyWaitAbout .container .box .text .title h2{
  width: 90%;
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 640px){
  .whyWaitAbout .container .box .text .title h2{
    width: auto;
  }
}

@media (min-width: 1280px){
  .whyWaitAbout .container .box .text .title h2{
    font-size: 2.375rem;
  }
}

.whyWaitAbout .container .box .text .btn{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

@media (min-width: 1024px){
  .whyWaitAbout .container .box .text .btn{
    gap: 1.56rem;
  }
}

.whyWaitAbout .container .box .text .btn button{
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  padding-left: 2.75rem;
  padding-right: 2.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.whyWaitAbout .container .box .text .btn button:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

@media (min-width: 1280px){
  .whyWaitAbout .container .box .text .btn button{
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

.whyWaitAbout .container .box .text .btn p{
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

@media (min-width: 1024px){
  .whyWaitAbout .container .box .text .btn p{
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

/** About us End **/

/** Prices **/

.plans{
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

@media (min-width: 1024px){
  .plans{
    margin-top: 6.25rem;
    margin-bottom: 3.37rem;
  }
}

.plans .container{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

@media (min-width: 1024px){
  .plans .container{
    gap: 2.86rem;
  }
}

.plans .container .plans-top{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.88rem;
}

.plans .container .plans-top h1.title{
  text-align: center;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(51 51 51 / var(--tw-text-opacity));
}

@media (min-width: 1280px){
  .plans .container .plans-top h1.title{
    font-size: 2.375rem;
  }
}

.plans .container .plans-top .nav{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

@media (min-width: 640px){
  .plans .container .plans-top .nav{
    flex-direction: row;
  }
}

.plans .container .plans-top .nav .plansBtn{
  display: flex;
  height: 3.5rem;
  width: 11rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  border-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(229 229 229 / var(--tw-border-opacity));
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.plans .container .plans-top .nav .plansBtn sub{
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(167 167 167 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.plans .container .plans-top .nav .plansBtn.active,
.plans .container .plans-top .nav .plansBtn:hover{
  border-width: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.plans .container .plans-top .nav .plansBtn.active sub,
.plans .container .plans-top .nav .plansBtn:hover sub{
  color: rgb(255 255 255 / 0.7);
}

.plans .container .plans-content > div .packages-container{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: 1.5rem;
}

.plans .container .plans-content > div .packages-container .packages-item{
  border-radius: 1rem;
  border-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(229 229 229 / var(--tw-border-opacity));
}

.packages-item-top{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  border-bottom-width: 1px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-bottom-color: rgb(229 229 229 / var(--tw-border-opacity));
  padding: 2rem;
}

.packages-item-top.popular{
  --tw-bg-opacity: 1;
  background-color: rgb(222 217 235 / var(--tw-bg-opacity));
}

.packages-item-top .popular-tag{
  position: absolute;
  top: 0px;
  display: flex;
  height: 2.125rem;
  width: 5.5625rem;
  align-items: center;
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgb(253 205 5 / var(--tw-bg-opacity));
}

.packages-item-top .popular-tag:where([dir="ltr"], [dir="ltr"] *){
  right: 0px;
  border-radius: 0.5rem 1rem 0.5rem 0.5rem;
}

.packages-item-top .popular-tag:where([dir="rtl"], [dir="rtl"] *){
  left: 0px;
  border-radius: 1rem 0.5rem 0.5rem 0.5rem;
}

.packages-item-top .popular-tag span{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.packages-item-top .text{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.packages-item-top .text .item-title h1{
  text-align: center;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.packages-item-top .text .item-price h1{
  font-size: 3rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.packages-item-top .text .item-price h1 sub{
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(128 128 128 / var(--tw-text-opacity));
}

.packages-item-top .text .item-desc p{
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(72 71 74 / var(--tw-text-opacity));
}

.packages-item-top .btn{
  width: 100%;
}

.packages-item-top .btn a{
  display: block;
  width: 100%;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.packages-item-top .btn a:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.packages-item-bottom ul{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1.5rem;
  padding: 2rem;
}

.packages-item-bottom ul li{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
}

.packages-item-bottom ul li .text{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

.compare .container{
  margin-bottom: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
}

@media (min-width: 1024px){
  .compare .container{
    margin-bottom: 4.96rem;
    gap: 4.96rem;
  }
}

.compare-btn button{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 160 / var(--tw-bg-opacity));
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  padding-left: 2.75rem;
  padding-right: 2.75rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  transition-duration: 150ms;
  transition-timing-function: linear;
}

.compare-btn button:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(90 64 155 / var(--tw-bg-opacity));
}

.compare-btn button .compare-btn-phrase-open,
.compare-btn button.active .compare-btn-phrase-close{
  display: block;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.compare-btn button.active .compare-btn-phrase-open,
.compare-btn button .compare-btn-phrase-close{
  display: none;
}

.compare-content{
  width: 100%;
  max-width: 69.9375rem;
}

.compare-content > table{
  width: 100%;
  border-collapse: separate;
  --tw-border-spacing-y: 1.12rem;
  border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
}

.compare-content > table > thead > tr > th{
  height: 4.0625rem;
  --tw-bg-opacity: 1;
  background-color: rgb(247 245 250 / var(--tw-bg-opacity));
}

.compare-content > table > tbody > tr{
  height: 4.0625rem;
  border-radius: 0.75rem;
  --tw-shadow: 0 0 2px #D3D3D3;
  --tw-shadow-colored: 0 0 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.compare-content > table > thead > tr > th:first-child{
  border-top-right-radius: 0.75rem;
  border-bottom-right-radius: 0.75rem;
}

.compare-content > table > thead > tr > th:last-child{
  border-top-left-radius: 0.75rem;
  border-bottom-left-radius: 0.75rem;
}

.compare-content > table .features-phrase{
  padding-right: 3rem;
  text-align: start;
}

.compare-content > table > thead th{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity));
}

.compare-content > table > tbody td{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(34 34 34 / var(--tw-text-opacity));
}

/** Prices End **/

.hover\:border-gray-300:hover{
  --tw-border-opacity: 1 !important;
  border-color: rgb(209 213 219 / var(--tw-border-opacity)) !important;
}

.hover\:bg-blue-800:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(30 66 159 / var(--tw-bg-opacity)) !important;
}

.hover\:bg-gray-100:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity)) !important;
}

.hover\:bg-white:hover{
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
}

.hover\:text-blue-600:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(28 100 242 / var(--tw-text-opacity)) !important;
}

.hover\:text-gray-600:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(75 85 99 / var(--tw-text-opacity)) !important;
}

.hover\:text-gray-900:hover{
  --tw-text-opacity: 1 !important;
  color: rgb(17 24 39 / var(--tw-text-opacity)) !important;
}

.focus\:outline-none:focus{
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}

.focus\:ring-2:focus{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}

.focus\:ring-4:focus{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}

.focus\:ring-blue-300:focus{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(164 202 254 / var(--tw-ring-opacity)) !important;
}

.focus\:ring-gray-200:focus{
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity)) !important;
}

.dark\:border-blue-500:is(.dark *){
  --tw-border-opacity: 1 !important;
  border-color: rgb(63 131 248 / var(--tw-border-opacity)) !important;
}

.dark\:border-gray-600:is(.dark *){
  --tw-border-opacity: 1 !important;
  border-color: rgb(75 85 99 / var(--tw-border-opacity)) !important;
}

.dark\:border-gray-700:is(.dark *){
  --tw-border-opacity: 1 !important;
  border-color: rgb(55 65 81 / var(--tw-border-opacity)) !important;
}

.dark\:border-transparent:is(.dark *){
  border-color: transparent !important;
}

.dark\:\!bg-gray-700:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(55 65 81 / var(--tw-bg-opacity)) !important;
}

.dark\:bg-blue-600:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(28 100 242 / var(--tw-bg-opacity)) !important;
}

.dark\:bg-gray-600:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(75 85 99 / var(--tw-bg-opacity)) !important;
}

.dark\:bg-gray-700:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(55 65 81 / var(--tw-bg-opacity)) !important;
}

.dark\:bg-gray-800:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity)) !important;
}

.dark\:bg-gray-800\/50:is(.dark *){
  background-color: rgb(31 41 55 / 0.5) !important;
}

.dark\:bg-gray-900\/80:is(.dark *){
  background-color: rgb(17 24 39 / 0.8) !important;
}

.dark\:text-blue-500:is(.dark *){
  --tw-text-opacity: 1 !important;
  color: rgb(63 131 248 / var(--tw-text-opacity)) !important;
}

.dark\:text-gray-400:is(.dark *){
  --tw-text-opacity: 1 !important;
  color: rgb(156 163 175 / var(--tw-text-opacity)) !important;
}

.dark\:text-gray-500:is(.dark *){
  --tw-text-opacity: 1 !important;
  color: rgb(107 114 128 / var(--tw-text-opacity)) !important;
}

.dark\:text-white:is(.dark *){
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
}

.dark\:hover\:bg-blue-700:hover:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(26 86 219 / var(--tw-bg-opacity)) !important;
}

.dark\:hover\:bg-gray-600:hover:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(75 85 99 / var(--tw-bg-opacity)) !important;
}

.dark\:hover\:bg-gray-800:hover:is(.dark *){
  --tw-bg-opacity: 1 !important;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity)) !important;
}

.dark\:hover\:text-blue-500:hover:is(.dark *){
  --tw-text-opacity: 1 !important;
  color: rgb(63 131 248 / var(--tw-text-opacity)) !important;
}

.dark\:hover\:text-gray-300:hover:is(.dark *){
  --tw-text-opacity: 1 !important;
  color: rgb(209 213 219 / var(--tw-text-opacity)) !important;
}

.dark\:hover\:text-white:hover:is(.dark *){
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
}

.rtl\:rotate-180:where([dir="rtl"], [dir="rtl"] *){
  --tw-rotate: 180deg !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.rtl\:space-x-reverse:where([dir="rtl"], [dir="rtl"] *) > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 1 !important;
}
